设计/免费工具
设计令牌生成器
创建带有活性组件预览的语义色彩,间距,半径,以及打字符号. 导出 CSS 自定义属性或 JSON没有人工智能就免费。
设计符号
design-tokens.css
:root {
--color-accent: #c65324;
--color-background: #faf8f5;
--color-foreground: #292521;
--color-surface: #ffffff;
--color-on-accent: #000000;
--font-family: "Inter", sans-serif;
--radius-sm: 6px;
--radius-md: 12px;
--radius-lg: 24px;
--space-1: 4px;
--space-2: 8px;
--space-3: 12px;
--space-4: 16px;
--space-6: 24px;
--space-8: 32px;
--space-12: 48px;
--space-16: 64px;
}字数: 38回到细节上
导出文本保留英文格式；您输入的内容保持不变。
没有注册。 没有AI的信用。 此工具将您在浏览器中的输出组装 。
从一个想法到有用的东西。
- 01
设置您的语义颜色和基本值 。
- 02
检查现场样本并产生间隔尺度。
- 03
复制 CSS 变量或导出匹配 JSON 数值。
有点背景
语义符号给反复的设计决定一个名称. 此工具会从您的选择中构建一个紧凑的调色板和间距缩放 。 CSS 财务报告和已审计财务报表 JSON 出口价值相同。 该 JSON 是一个简单的密钥值符号文档,而不是声称遵守了特定的符号交换标准。
问得好
我能用这个和我的话题吗?
对 将导出符号映射或重命名为主题的常规, 而不是盲目替换一个已建立系统 。
这是否创造了光明和黑暗的主题?
它一次输出一个调色板. 在每种模式中分别创建和下载每个调色板并审查对比度.