Glyphs

网站描述

Glyphs.fyi 是一个开源图标设计系统，专为设计师和开发者打造。支持暗黑和白天模式，可以在Figma中编辑，开源。

Glyphs是什么

Glyphs 是一个真正令人惊叹的开源设计系统！它不仅仅是一个图标库，而是一个完全可编辑且真正开源的设计系统。所有图标都在 Figma 中精心设计，通过 GitHub 开源分享，还提供了完整的 Web 组件和 CLI 工具。最独特的是它支持可选的深色模式，所有图标都经过精心分类和标签化，便于搜索和使用。作为一个开源项目，它完美展现了社区协作的力量。

主页

文档

如何使用Glyphs

使用 Glyphs 设计系统非常灵活，提供多种方式来满足不同的需求：

设计师使用方式

从 Figma Community 获取完整的设计文件
直接在 Figma 中编辑和定制图标
参与社区贡献，提交新的图标设计
使用精心分类和标签化的图标系统

开发者集成方式

Web 组件：集成到任何现代 Web 应用中
CLI 工具：从 Figma 直接下载 SVG 文件
GitHub 仓库：获取完整的图标资源
文档指南：跟随详细的使用说明

定制化功能

支持深色模式的无缝切换
完全可编辑的设计系统
响应式设计适配

Glyphs 的特色

完全开源的设计系统

真正的开源项目，支持社区贡献，所有人都可以参与图标系统的建设和改进。

Figma 原生设计

所有图标都在 Figma 中设计，提供完整的设计文件，设计师可以直接编辑和定制。

Web 组件支持

提供现代 Web 组件，可以无缝集成到任何前端框架和应用中。

CLI 工具套件

强大的命令行工具，可以直接从 Figma 下载 SVG 文件，自动化工作流程。

深色模式支持

内置可选的深色模式，图标在不同主题下都能完美显示。

智能分类系统

所有图标都经过精心分类和标签化，支持快速搜索和定位所需图标。

Glyphs 的使用场景

企业设计系统

为企业建立统一的设计语言和图标系统，确保产品设计的一致性和专业性。

开源项目贡献

参与开源社区，为图标库贡献新的设计，与全球设计师和开发者协作。

Web 应用开发

在现代 Web 应用中集成高质量图标，提升用户界面的视觉体验。

原型设计

在 Figma 中快速创建产品原型，使用丰富的图标资源提升设计效率。

多主题适配

利用深色模式支持，为应用创建适应不同主题的一致视觉体验。

Glyphs 优缺点

优点

完全开源，无任何使用限制

Figma 原生设计，设计师友好

提供完整的开发工具链

支持深色模式和多主题

活跃的社区支持和贡献

详细的文档和指南

精心分类的图标系统

可完全定制和编辑

缺点

图标数量相对有限

需要一定的技术基础

依赖 Figma 和 GitHub

更新频率依赖社区贡献

缺乏官方技术支持

学习曲线相对较陡

Glyphs 常见问题

Q1: Glyphs 设计系统是否真的完全免费？

是的，Glyphs 是一个完全开源的项目，所有图标、设计文件、工具都免费使用，包括商业项目。

Q2: 如何在我的项目中使用 Glyphs 图标？

你可以通过多种方式使用：1) 使用 Web 组件集成；2) 通过 CLI 工具下载 SVG；3) 从 Figma 设计文件中导出；4) 直接从 GitHub 仓库获取。

Q3: 我可以修改和定制这些图标吗？

当然可以！这是开源设计系统的核心优势。你可以在 Figma 中直接编辑图标，或者修改 SVG 代码来满足项目需求。

Q4: 如何为 Glyphs 项目贡献新图标？

你可以在 GitHub 上提交 issue 或 pull request，或者在 Figma 社区中分享你的设计。项目维护者会审核并考虑将优质图标加入主库。

Q5: Glyphs 支持哪些开发框架？

Glyphs 提供的 Web 组件可以在任何现代前端框架中使用，包括 React、Vue、Angular 等。SVG 格式更是通用兼容。

Q6: 深色模式是如何工作的？

Glyphs 设计时就考虑了深色模式支持，图标在浅色和深色背景下都能保持良好的视觉效果和可读性。

Q7: CLI 工具具体能做什么？

CLI 工具可以从 Figma 直接下载最新的 SVG 图标，自动化图标更新流程，支持批量操作和自定义配置。

更多图标

Iconic

Iconic 是由两位设计师：James McDonald和Orman Clark开发与设计，它们定期更新风格一致的图标(24x24边界框、1.5px描边、SVG格式)，并提供免费&收费下载。

Coolicons

Coolicons 是一个精心设计的图标合集，包含 440 多个图标，专注于简洁性和一致性。它非常适合网页、应用程序和移动端设计。

Icons Download

icons.download是一套16种风格的矢量图标，开源，可以一键复制SVG代码

Untitled UIi Free Icon

Untitled UI Icons 是一款简洁、统一、中性的图标库，专门为现代 UI 设计精心打造。它完全在 Figma 中设计，所以可以直接用在Figma，现在也已支持 React 项目。设计团队曾遍寻各处，希望能找到一套“终极”图标集，用于他们所有的现代 UI 设计项目，但始终未能找到一套令他们真正满意的 Figma 图标库。正因如此，他们决定亲自动手，创造了 Untitled UI Icons。Untitled UI Icons 不仅荣获 Product Hunt 的“本周第一产品”称号，更是全球最受欢迎的图标库之一，在 Figma 社区的下载量已突破 23 万次。