tdesign-icons
//primary
{
"0": "#fff2fc",
"5": "#fed6f4",
"10": "#fdbbed",
"20": "#fa86df",
"30": "#f557d3",
"40": "#ed30ca",
"50": "#e413c3",
"60": "#d700bf",
"70": "#c700bb",
"80": "#b300b3",
"90": "#94009e",
"100": "#770087"
}
// success
{
"0": "#f6fffc",
"5": "#c1f7e8",
"10": "#90eed7",
"20": "#59ddc1",
"30": "#39cbb0",
"40": "#26baa0",
"50": "#1ba892",
"60": "#149783",
"70": "#108575",
"80": "#0c6f5e",
"90": "#095948"
}
// Error
- 整理所有颜色
- 识别你所有的颜色并将它们组织成逻辑组。
- Primary colors | Secondary colors | Neutrals | Semantic colors
- 定义系统来创建扩展调色板
- 创建基础颜色变化的系统
- 建立命名约定
- 确保所有相关者可以理解
- 验证新的颜色
- 确保新颜色满足您的所有颜色要求并符合可访问性标准
- 定义使用指南
- 为背景、文本、容器等全局 UI 元素分配颜色。
- 发布测试
- 将新的调色板和使用指南推送给团队中的相关者
- 迭代
- 整合团队的反馈并在需要时进行更改
- 向开发人员发布
- 然后开发人员可以将颜色系统用于他们的组件库