sag-icons

为多色态 UI 而生的图标库

状态感知的多色调 SVG 图标,CSS 变量驱动,Web Components 跨框架

🎨

多色调配色

每个图标通过 data-tone 属性支持多个独立色块,可在激活态下显示完整配色

⚡

CSS 状态切换

默认灰色,添加 is-active 类即可激活为彩色,无需 JavaScript 介入

📱

响应式尺寸

内置可折叠侧边栏支持,配合容器尺寸自动调整图标大小

📘

TypeScript

完整的类型定义与 IDE 智能提示,组件 props 开箱即用

🚀

零运行时

纯 SVG 元素与 CSS 变量驱动,无 JavaScript 包体开销

🌐

跨框架

一个 Web Component 跨 React / Vue / 任意框架,不需要 react-lucide / vue-lucide 多包