Stark - Contrast & Accessibility Checker丨无障碍设计 图标

Stark - Contrast & Accessibility Checker丨无障碍设计

作者 Stark

定价

免费

类别

⚙️ 设计系统

推荐

Stark - Contrast & Accessibility Checker丨无障碍设计 展示图

✏️ 介绍 Stark 是一套用于在 Figma 中检查和提升无障碍设计质量的工具。它把对比度、视觉模拟、焦点顺序、Alt Text、Typography、Touch Target 等能力集中到一个插件里,适合在设计阶段提前发现 Accessibility 问题,也方便团队在开发交付前做系统检查。 🔨 功能 1. Sidekick 可自动扫描 Figma 文件,并给出无障碍问题和修复建议 2. Contrast Checker 可检查颜色对比度,并判断是否符合 WCAG AA / AAA 3. 支持结合本地和远程 Library 颜色给出替代配色建议 4. Vision Simulator 可模拟多种色盲、模糊、低对比度、重影、黄化等视觉情况 5. Vision Generator 可把视觉模拟结果直接生成成 Frame 6. 支持 Landmarks 和 Focus Order,帮助检查键盘和屏幕阅读器导航顺序 7. Alt-Text Annotations 可辅助生成和检查图片替代文本 8. 支持 Typography Analysis,检查字体和文字样式的可读性 9. 可批量把 Typography 修改应用到相同字体设置的图层 10. 支持 Touch Targets 检查,判断移动端点击区域是否足够大 11. 支持添加 ARIA、VoiceOver、TalkBack、React Native、Narrator 等无障碍交付注释 12. 适合网站、App、SaaS 和其他数字产品的无障碍设计检查与开发交付

Figmentation|设计系统 图标
Figmentation|设计系统

作者 Fateema Ashraf

Figmentation|设计系统 封面

✏️ 介绍 Figmentation 是一款用于自动生成 Figma 设计文档和 Token 标注的插件。它可以从组件中自动提取颜色、字体、间距、边框和效果等设计 Token,并在组件旁边生成结构化说明,适合设计系统维护、开发交付和 UI 组件文档整理。 🔨 功能 1. 自动提取组件中绑定的 Design Token 2. 支持颜色、字体、间距、边框、阴影、模糊等多种属性 3. 可识别背景色、文字颜色和描边颜色 4. 支持提取字号、字体、字重、行高和字间距 5. 支持提取 Padding、Gap、圆角和 Stroke Width 6. 可自动在组件旁生成清晰的 Annotation 标注区域 7. 支持 camelCase、kebab-case 等多种命名方式 8. 优先保留现有 Token 名称,没有名称时可生成备用命名 9. 适合 Design System、组件库和开发 Handoff 场景 10. 可减少重复手动标注和维护设计文档的工作量

Unused Components|未使用的组件 封面

✏️ 介绍 这是一款用于检查 Figma 文件中组件使用情况的插件。它可以扫描整个文件,找出哪些组件从未被使用,同时统计每个组件被使用了多少次,适合整理组件库和清理冗余资源。 🔨 功能 1. 扫描整个 Figma 文件中的组件 2. 找出所有未被使用的 Component 3. 统计每个组件的使用次数 4. 帮助识别冗余或废弃组件 5. 适合设计系统维护和组件库清理场景

Supa Design Tokens|设计系统 封面

✏️ 介绍 Supa Design Tokens 是一款用于在 Figma 中创建、管理和导出 Design Token 的插件。它可以把颜色、字体、阴影、间距、圆角、断点等设计规范快速生成成 Figma Variables 和 Styles,并支持导出给开发使用,适合搭建设计系统和统一设计规范。 🔨 功能 1. 支持生成 Color、Typography、Effects、Dimensions、Layout 等多类 Design Token 2. 可自动生成完整颜色体系,支持 P3、OKLCH、亮度、透明度和对比度控制 3. 支持批量生成字体层级,包括 Heading、Body 和自定义 Text Style 4. 可设置字体、字号、字重、行高、字间距和命名规则 5. 支持生成阴影、模糊、Spacing、Size、Border Radius 等 Token 6. 支持 Breakpoint 和 Container 等响应式布局 Token 7. 内置 Tailwind、Material UI 等常见设计系统 Token,可快速复用 8. 可一键同步为 Figma Variables 和 Styles 9. 支持批量管理大量 Token,并提供搜索能力 10. 支持导入现有 Figma Token 或符合 DTCG 规范的 JSON 11. 支持导出 CSS、Tailwind、SCSS、JSON 等开发格式 12. 可在 Figma 中自动生成卡片、表格和 Tile 形式的 Token 文档 13. 支持查看颜色可访问性和对比度信息 14. 支持直接编辑 Token Code,方便做更细致的自定义 15. 适合设计系统、团队协作和设计开发交付场景

Component Inventory丨组件 图标
Component Inventory丨组件

作者 Graham Paterson

Component Inventory丨组件 封面

✏️ 介绍 Component Inventory 是一款用于快速查看和盘点 Figma 组件库的插件。它会自动扫描当前文件中的所有 Component 和 Component Set,并把每个组件生成一个 Instance 集中放到新的页面里,方便查找组件和检查设计系统。 🔨 功能 1. 自动创建一个新的 Component Inventory 页面 2. 扫描当前 Figma 文件中的所有页面 3. 查找所有 Component 和 Component Set 4. 为每个组件生成一个 Instance 并集中展示 5. 方便快速浏览和查找组件 6. 适合做 Design System 盘点和组件库审查 7. 支持设置扫描深度,只包含指定层级内的组件 8. 可通过 Figma Quick Actions 快速调用并设置搜索深度

Color Swatch 1M+丨调色板 图标
Color Swatch 1M+丨调色板

作者 Color Creator

Color Swatch 1M+丨调色板 封面

✏️ 介绍 PaletteFlow 是一款用于在 Figma 中快速查找和管理配色方案的插件。它提供 100,000+ 经过整理的专业色板,可以按氛围、风格或颜色浏览,并一键添加为 Figma Local Variables,适合 UI、品牌、网页和设计系统配色。 🔨 功能 1. 提供 100,000+ 专业整理的配色色板 2. 支持按 Mood、Style 或 Color 浏览和筛选 3. 可一键把整套色板添加为 Figma Local Variable Collection 4. 方便后续统一管理和更新设计系统中的颜色 5. 支持从起始颜色生成互补色、邻近色等配色方案 6. 可从图片中提取颜色,快速生成对应色板 7. 支持保存和管理自己的配色方案 8. 适合 UI/UX、品牌、Web 和产品设计中的配色探索 9. 有助于保持不同页面、组件和产品触点之间的颜色一致性 10. 适合快速建立或补充 Design System 的颜色体系

UI Elements丨UI组件 图标
UI Elements丨UI组件

作者 uxplugins

UI Elements丨UI组件 封面

✏️ 介绍 UI Elements 是一款用于在 Figma 中快速获取现成 UI 资源的插件。它整合了大量页面 Section、组件和开源图标,可以直接拖拽到设计稿中使用,适合网页、App、后台和其他数字产品的快速搭建。 🔨 功能 1. 提供 130+ 现成页面 Section 2. 提供 6,800+ UI Components 3. 提供 160,000+ 开源 Icons 4. 支持直接 Drag & Drop 到 Figma 画布 5. 组件覆盖 Navigation、Form、Button、Content Block、Date Picker、Dialog 等常见类型 6. Section 覆盖 Homepage、About、Contact、Services 等常见页面模块 7. 支持搜索和自定义不同 UI 元素 8. 提供 Animated Titles,可生成动态标题 9. 动态标题支持导入为 MP4、GIF 10. 支持下载 Lottie 文件用于 Web 11. 适合快速搭建网站、App、营销页面和产品原型