主题颜色
TuniaoUI 内置 6 大主题色，每种颜色提供浅色和深色变种，满足不同场景的视觉需求。
样式展示
Primary
dark-2
primary
light-3
light-5
light-7
light-8
light-9
Success
dark-2
success
light-3
light-5
light-7
light-8
light-9
Warning
dark-2
warning
light-3
light-5
light-7
light-8
light-9
Danger
dark-2
danger
light-3
light-5
light-7
light-8
light-9
Error
dark-2
error
light-3
light-5
light-7
light-8
light-9
Info
dark-2
info
light-3
light-5
light-7
light-8
light-9
颜色有效值
类型颜色
| 类型 | 说明 |
|---|---|
primary | 主色 |
success | 成功色 |
warning | 警告色 |
danger | 危险色 |
error | 错误色 |
info | 信息色 |
变种后缀
每种主题色提供以下变种：
| 变种 | 说明 |
|---|---|
dark-2 | 深色变种 |
light-3 | 浅色 30% |
light-5 | 浅色 50% |
light-7 | 浅色 70% |
light-8 | 浅色 80% |
light-9 | 浅色 90% |
使用方式
typescript
import { getThemeColor, getThemeColorLight } from "@tuniao/tn-ui/common/theme_helpers";
// 获取主题色
getThemeColor(this.baseStyle, "primary")
// 获取主题浅色变种
getThemeColorLight(this.baseStyle, "primary")