Color
| Neutral | ||
|---|---|---|
| Used for text and structural elements such as lines, borders, and horizontal rules. | ||
| neutral.10 | #253746 | |
| neutral.20 | #3b4a58 | |
| neutral.30 | #515f6b | |
| neutral.40 | #68747f | |
| neutral.50 | #808993 | |
| neutral.60 | #98a0a8 | |
| neutral.70 | #b1b7bd | |
| neutral.80 | #caced3 | |
| neutral.90 | #e4e6e9 | |
| neutral.95 | #f2f3f4 |
| Accent | ||
|---|---|---|
| Used to attract the user’s attention. | ||
| accent.5 | #031935 | |
| accent.10 | #1a2b4a | |
| accent.20 | #303f5f | |
| accent.30 | #3c5080 | |
| accent.40 | #4660a2 | |
| accent.50 | #5873bd | |
| accent.60 | #758acd | |
| accent.70 | #93a3db | |
| accent.80 | #b3bee8 | |
| accent.90 | #d4daf3 | |
| accent.95 | #e5e9f8 | |
| accent.99 | #f7f8fd |
| Decorative | ||
|---|---|---|
| decorative.0 | #d033ff | |
| decorative.1 | #ff8324 | |
| decorative.2 | #15ff2d | |
| decorative.3 | #0740ff | |
| decorative.4 | #f9008d | |
| decorative.5 | #d4ed00 | |
| decorative.6 | #00e1ad | |
| decorative.7 | #5d00d6 | |
| decorative.8 | #cb1500 | |
| decorative.9 | #2cc100 | |
| decorative.10 | #0067b7 |
| DecorativeDark | ||
|---|---|---|
| decorativeDark.0 | #640099 | |
| decorativeDark.1 | #8e2500 | |
| decorativeDark.2 | #009700 | |
| decorativeDark.3 | #000098 | |
| decorativeDark.4 | #880036 | |
| decorativeDark.5 | #6a8b00 | |
| decorativeDark.6 | #007d51 | |
| decorativeDark.7 | #000073 | |
| decorativeDark.8 | #5f0000 | |
| decorativeDark.9 | #005f00 | |
| decorativeDark.10 | #001959 |
| DecorativeLight | ||
|---|---|---|
| decorativeLight.0 | #ffa4ff | |
| decorativeLight.1 | #ffe786 | |
| decorativeLight.2 | #b2ff9d | |
| decorativeLight.3 | #ae9bff | |
| decorativeLight.4 | #ff95ef | |
| decorativeLight.5 | #ffff8c | |
| decorativeLight.6 | #a1ffff | |
| decorativeLight.7 | #ce76ff | |
| decorativeLight.8 | #ff895d | |
| decorativeLight.9 | #a6ff7d | |
| decorativeLight.10 | #8ec4ff |
| Text | ||
|---|---|---|
| text.active | #4462ED | |
| text.button | #4462ED | |
| text.primary | #253746 | |
| text.primaryLight | #fff | |
| text.secondary | #68747f | |
| text.secondaryLight | #f2f3f4 |
| Line | ||
|---|---|---|
| line.hairline | #e4e6e9 | |
| line.light | #caced3 | |
| line.regular | #808993 |
| Critical | ||
|---|---|---|
| critical.bright | #a31300 | |
| critical.dark | #a31300 | |
| critical.light | #ffebe7 |
| Success | ||
|---|---|---|
| success.bright | #00af18 | |
| success.dark | #008512 | |
| success.light | #e6ffe9 |
| Warning | ||
|---|---|---|
| warning.bright | #ffb91c | |
| warning.dark | #b05b00 | |
| warning.light | #fff6e6 |