Figma Design Tokens to Tailwind Classes
This table presents the mapping between Figma design tokens and Tailwind utility classes in the Nova design system.
Color Tokens
| Type | Figma Token | Tailwind Class | Ocean Light | Ocean Dark | Spark Light | Spark Dark |
|---|---|---|---|---|---|---|
| background | --color-dont-use-background | .bg-dont-use | #f5f6f7 | #0b0f11 | #f6f6f6 | #0e0e0e |
| background | --color-feedback-error-high-background | .bg-feedback-error-high | #ff6161 | #ff6161 | #ff6161 | #ff6161 |
| background | --color-feedback-error-high-contrast-background | .bg-feedback-error-high-contrast | #bb1919 | #ff6161 | #bb1919 | #ff6161 |
| background | --color-feedback-error-low-background | .bg-feedback-error-low | #ffeded | #380101 | #ffeded | #380101 |
| background | --color-feedback-information-high-background | .bg-feedback-information-high | #659fff | #659fff | #659fff | #659fff |
| background | --color-feedback-information-high-contrast-background | .bg-feedback-information-high-contrast | #659fff | #659fff | #09285c | #659fff |
| background | --color-feedback-information-low-background | .bg-feedback-information-low | #f0f6ff | #001c37 | #f0f6ff | #001c37 |
| background | --color-feedback-neutral-high-background | .bg-feedback-neutral-high | #9fadb2 | #9fadb2 | #a9a9a9 | #a9a9a9 |
| background | --color-feedback-neutral-high-contrast-background | .bg-feedback-neutral-high-contrast | #3f555e | #9fadb2 | #4f4f4f | #a9a9a9 |
| background | --color-feedback-neutral-low-background | .bg-feedback-neutral-low | #f5f6f7 | #171f22 | #f6f6f6 | #1d1d1d |
| background | --color-feedback-success-high-background | .bg-feedback-success-high | #45d24d | #6bde71 | #45d24d | #6bde71 |
| background | --color-feedback-success-high-contrast-background | .bg-feedback-success-high-contrast | #008207 | #45d24d | #008207 | #45d24d |
| background | --color-feedback-success-low-background | .bg-feedback-success-low | #eafeeb | #002302 | #eafeeb | #002302 |
| background | --color-feedback-warning-high-background | .bg-feedback-warning-high | #e0a917 | #e0a917 | #e0a917 | #e0a917 |
| background | --color-feedback-warning-high-contrast-background | .bg-feedback-warning-high-contrast | #805c00 | #e0a917 | #805c00 | #e0a917 |
| background | --color-feedback-warning-low-background | .bg-feedback-warning-low | #fff7df | #302300 | #fff7df | #302300 |
| background | --color-focus-background | .bg-focus | #ffffff | #0b0f11 | #ffffff | #0e0e0e |
| background | --color-focus-background-inverted | .bg-focus-inverted | #0b0f11 | #ffffff | #0e0e0e | #ffffff |
| background | --color-interaction-container-branded-high-background | .bg-interaction-container-branded-high | #1f717d | #258998 | #e75420 | #e75420 |
| background | --color-interaction-container-branded-high-background-active | .bg-interaction-container-branded-high-active | #185963 | #4b9eaa | #bf451a | #eb7247 |
| background | --color-interaction-container-branded-high-background-hover | .bg-interaction-container-branded-high-hover | #185963 | #4b9eaa | #bf451a | #eb7247 |
| background | --color-interaction-container-branded-low-background | .bg-interaction-container-branded-low | #ffffff | #0b0f11 | #ffffff | #0e0e0e |
| background | --color-interaction-container-branded-low-background-active | .bg-interaction-container-branded-low-active | #e4f0f2 | #0b292e | #fceae3 | #45190a |
| background | --color-interaction-container-branded-low-background-hover | .bg-interaction-container-branded-low-hover | #e4f0f2 | #0b292e | #fceae3 | #45190a |
| background | --color-interaction-container-neutral-background | .bg-interaction-container-neutral | rgba(255, 255, 255, 0) | rgba(0, 0, 0, 0) | rgba(255, 255, 255, 0) | rgba(0, 0, 0, 0) |
| background | --color-interaction-container-neutral-background-active | .bg-interaction-container-neutral-active | #e4f0f2 | #0b292e | #fceae3 | #45190a |
| background | --color-interaction-container-neutral-background-hover | .bg-interaction-container-neutral-hover | #f5f6f7 | #171f22 | #f6f6f6 | #1d1d1d |
| background | --color-level-00-background | .bg-level-00 | #ffffff | #0b0f11 | #ffffff | #0e0e0e |
| background | --color-level-05-background | .bg-level-05 | #fafbfb | #11171a | #fbfbfb | #161616 |
| background | --color-level-10-background | .bg-level-10 | #f5f6f7 | #171f22 | #f6f6f6 | #1d1d1d |
| background | --color-level-15-background | .bg-level-15 | #eaeef0 | #171f22 | #ededed | #252525 |
| background | --color-level-20-background | .bg-level-20 | #ffffff | #222e33 | #ffffff | #2b2b2b |
| background | --color-level-30-background | .bg-level-30 | #f5f6f7 | #2e3e44 | #f6f6f6 | #3a3a3a |
| background | --color-level-40-background | .bg-level-40 | #ffffff | #394d55 | #ffffff | #484848 |
| background | --color-level-inverted-00-background | .bg-level-inverted-00 | #0b0f11 | #ffffff | #0e0e0e | #ffffff |
| background | --color-level-inverted-05-background | .bg-level-inverted-05 | #11171a | #fafbfb | #161616 | #fbfbfb |
| background | --color-level-inverted-10-background | .bg-level-inverted-10 | #171f22 | #f5f6f7 | #1d1d1d | #f6f6f6 |
| background | --color-level-inverted-15-background | .bg-level-inverted-15 | #1e272b | #eaeef0 | #252525 | #ededed |
| background | --color-level-inverted-20-background | .bg-level-inverted-20 | #222e33 | #ffffff | #2b2b2b | #ffffff |
| background | --color-level-inverted-30-background | .bg-level-inverted-30 | #2e3e44 | #f5f6f7 | #3a3a3a | #f6f6f6 |
| background | --color-level-inverted-40-background | .bg-level-inverted-40 | #394d55 | #ffffff | #484848 | #ffffff |
| background | --color-rainbow-1-background | .bg-rainbow-1 | #fdefe2 | #432306 | #fdefe2 | #432306 |
| background | --color-rainbow-10-background | .bg-rainbow-10 | #eaeef0 | #27353b | #ededed | #313131 |
| background | --color-rainbow-2-background | .bg-rainbow-2 | #fceae3 | #45190a | #fceae3 | #45190a |
| background | --color-rainbow-3-background | .bg-rainbow-3 | #fff7df | #4d3a00 | #fff7df | #4d3a00 |
| background | --color-rainbow-4-background | .bg-rainbow-4 | #f9e3e3 | #3d0909 | #f9e3e3 | #3d0909 |
| background | --color-rainbow-5-background | .bg-rainbow-5 | #ecf4f3 | #1c2b28 | #ecf4f3 | #1c2b28 |
| background | --color-rainbow-6-background | .bg-rainbow-6 | #f7e9ee | #2e0010 | #f7e9ee | #2e0010 |
| background | --color-rainbow-7-background | .bg-rainbow-7 | #e2f0e2 | #09400c | #e2f0e2 | #062908 |
| background | --color-rainbow-8-background | .bg-rainbow-8 | #e4f0f2 | #0b292e | #e4f0f2 | #0b292e |
| background | --color-rainbow-9-background | .bg-rainbow-9 | #f1f4e5 | #2a330e | #f1f4e5 | #2a330e |
| border | --color-content-high-border | .border-high | #889499 | #889499 | #919191 | #919191 |
| border | --color-content-low-border | .border-low | #e1e4e6 | #394d55 | #e3e3e3 | #484848 |
| border | --color-content-medium-border | .border-medium | #bac1c4 | #617177 | #bfbfbf | #6d6d6d |
| border | --color-dont-use-border | .border-dont-use | #c6ced1 | #1e272b | #e3e3e3 | #252525 |
| border | --color-feedback-error-high-border | .border-feedback-error-high | #ff6161 | #ff6161 | #ff6161 | #ff6161 |
| border | --color-feedback-error-high-contrast-border | .border-feedback-error-high-contrast | #bb1919 | #ff6161 | #bb1919 | #ff6161 |
| border | --color-feedback-error-low-border | .border-feedback-error-low | #bb1919 | #ff6161 | #bb1919 | #ff6161 |
| border | --color-feedback-error-low-border-subtle | .border-feedback-error-low-subtle | #f5c4c4 | #911515 | #f5c4c4 | #911515 |
| border | --color-feedback-information-high-border | .border-feedback-information-high | #659fff | #659fff | #659fff | #659fff |
| border | --color-feedback-information-high-contrast-border | .border-feedback-information-high-contrast | #659fff | #659fff | #09285c | #659fff |
| border | --color-feedback-information-low-border | .border-feedback-information-low | #2660c2 | #659fff | #2660c2 | #659fff |
| border | --color-feedback-information-low-border-subtle | .border-feedback-information-low-subtle | #c7dcff | #113a80 | #c7dcff | #113a80 |
| border | --color-feedback-neutral-high-border | .border-feedback-neutral-high | #9fadb2 | #9fadb2 | #a9a9a9 | #a9a9a9 |
| border | --color-feedback-neutral-high-contrast-border | .border-feedback-neutral-high-contrast | #3f555e | #9fadb2 | #4f4f4f | #a9a9a9 |
| border | --color-feedback-neutral-low-border | .border-feedback-neutral-low | #3f555e | #9fadb2 | #4f4f4f | #a9a9a9 |
| border | --color-feedback-neutral-low-border-subtle | .border-feedback-neutral-low-subtle | #e1e4e6 | #394d55 | #e3e3e3 | #484848 |
| border | --color-feedback-success-high-border | .border-feedback-success-high | #45d24d | #6bde71 | #45d24d | #6bde71 |
| border | --color-feedback-success-high-contrast-border | .border-feedback-success-high-contrast | #008207 | #45d24d | #008207 | #45d24d |
| border | --color-feedback-success-low-border | .border-feedback-success-low | #008207 | #45d24d | #008207 | #45d24d |
| border | --color-feedback-success-low-border-subtle | .border-feedback-success-low-subtle | #c8facb | #035707 | #c8facb | #035707 |
| border | --color-feedback-warning-high-border | .border-feedback-warning-high | #e0a917 | #e0a917 | #e0a917 | #e0a917 |
| border | --color-feedback-warning-high-contrast-border | .border-feedback-warning-high-contrast | #805c00 | #e0a917 | #805c00 | #e0a917 |
| border | --color-feedback-warning-low-border | .border-feedback-warning-low | #805c00 | #e0a917 | #805c00 | #e0a917 |
| border | --color-feedback-warning-low-border-subtle | .border-feedback-warning-low-subtle | #fae49d | #805c00 | #fae49d | #805c00 |
| border | --color-interaction-container-branded-high-border | .border-interaction-container-branded-high | #1f717d | #258998 | #e75420 | #e75420 |
| border | --color-interaction-container-branded-high-border-active | .border-interaction-container-branded-high-active | #185963 | #4b9eaa | #bf451a | #eb7247 |
| border | --color-interaction-container-branded-high-border-hover | .border-interaction-container-branded-high-hover | #185963 | #4b9eaa | #bf451a | #eb7247 |
| border | --color-interaction-container-branded-low-border | .border-interaction-container-branded-low | #1f717d | #258998 | #e75420 | #e75420 |
| border | --color-interaction-container-branded-low-border-active | .border-interaction-container-branded-low-active | #185963 | #4b9eaa | #bf451a | #eb7247 |
| border | --color-interaction-container-branded-low-border-hover | .border-interaction-container-branded-low-hover | #185963 | #4b9eaa | #bf451a | #eb7247 |
| border | --color-interaction-container-neutral-border | .border-interaction-container-neutral | #617177 | #889499 | #6d6d6d | #808080 |
| border | --color-interaction-container-neutral-border-active | .border-interaction-container-neutral-active | #185963 | #4b9eaa | #bf451a | #eb7247 |
| border | --color-interaction-container-neutral-border-hover | .border-interaction-container-neutral-hover | #34464d | #bac1c4 | #414141 | #bfbfbf |
| border | --color-rainbow-1-border | .border-rainbow-1 | #9c5311 | #f0801a | #9c5311 | #f0801a |
| border | --color-rainbow-1-border-light | .border-rainbow-1-light | #fbd9ba | #9c5311 | #fbd9ba | #9c5311 |
| border | --color-rainbow-10-border | .border-rainbow-10 | #394d55 | #9fadb2 | #484848 | #a9a9a9 |
| border | --color-rainbow-10-border-light | .border-rainbow-10-light | #c6ced1 | #3f555e | #cccccc | #4f4f4f |
| border | --color-rainbow-2-border | .border-rainbow-2 | #963715 | #eb7247 | #963715 | #eb7247 |
| border | --color-rainbow-2-border-light | .border-rainbow-2-light | #f8ccbc | #963715 | #f8ccbc | #963715 |
| border | --color-rainbow-3-border | .border-rainbow-3 | #795c00 | #d29f00 | #795c00 | #d29f00 |
| border | --color-rainbow-3-border-light | .border-rainbow-3-light | #ffe286 | #a67d00 | #ffe286 | #a67d00 |
| border | --color-rainbow-4-border | .border-rainbow-4 | #cc1d1d | #e79494 | #cc1d1d | #e79494 |
| border | --color-rainbow-4-border-light | .border-rainbow-4-light | #f0bbbb | #a81818 | #f0bbbb | #a81818 |
| border | --color-rainbow-5-border | .border-rainbow-5 | #32504c | #84b8b1 | #32504c | #84b8b1 |
| border | --color-rainbow-5-border-light | .border-rainbow-5-light | #d2e5e3 | #456e68 | #d2e5e3 | #456e68 |
| border | --color-rainbow-6-border | .border-rainbow-6 | #ab2d58 | #cf869f | #ab2d58 | #cf869f |
| border | --color-rainbow-6-border-light | .border-rainbow-6-light | #e0b3c2 | #7e002c | #e0b3c2 | #7e002c |
| border | --color-rainbow-7-border | .border-rainbow-7 | #106f15 | #66b16a | #106f15 | #66b16a |
| border | --color-rainbow-7-border-light | .border-rainbow-7-light | #b8dbba | #106f15 | #b8dbba | #106f15 |
| border | --color-rainbow-8-border | .border-rainbow-8 | #1f717d | #71b2bc | #1f717d | #71b2bc |
| border | --color-rainbow-8-border-light | .border-rainbow-8-light | #bedce0 | #1f717d | #bedce0 | #1f717d |
| border | --color-rainbow-9-border | .border-rainbow-9 | #5c6e1f | #8da930 | #5c6e1f | #8da930 |
| border | --color-rainbow-9-border-light | .border-rainbow-9-light | #dde5c1 | #5c6e1f | #dde5c1 | #5c6e1f |
| icon | --color-content-high-icon | .icon-high | #171f22 | #f5f6f7 | #1d1d1d | #f6f6f6 |
| icon | --color-content-inverted-high-icon | .icon-inverted-high | #f5f6f7 | #0b0f11 | #f6f6f6 | #1d1d1d |
| icon | --color-content-inverted-low-icon | .icon-inverted-low | #617177 | #3f555e | #6d6d6d | #6d6d6d |
| icon | --color-content-inverted-medium-icon | .icon-inverted-medium | #889499 | #27353b | #919191 | #414141 |
| icon | --color-content-low-icon | .icon-low | #617177 | #889499 | #6d6d6d | #808080 |
| icon | --color-content-medium-icon | .icon-medium | #34464d | #bac1c4 | #414141 | #bfbfbf |
| icon | --color-feedback-error-high-contrast-icon | .icon-feedback-error-high-contrast | #ffffff | #000000 | #ffffff | #000000 |
| icon | --color-feedback-error-high-icon | .icon-feedback-error-high | #380101 | #380101 | #380101 | #380101 |
| icon | --color-feedback-error-low-icon | .icon-feedback-error-low | #bb1919 | #ff6161 | #bb1919 | #ff6161 |
| icon | --color-feedback-information-high-contrast-icon | .icon-feedback-information-high-contrast | #ffffff | #000000 | #ffffff | #000000 |
| icon | --color-feedback-information-high-icon | .icon-feedback-information-high | #09285c | #09285c | #09285c | #09285c |
| icon | --color-feedback-information-low-icon | .icon-feedback-information-low | #2660c2 | #659fff | #2660c2 | #659fff |
| icon | --color-feedback-neutral-high-contrast-icon | .icon-feedback-neutral-high-contrast | #ffffff | #000000 | #ffffff | #000000 |
| icon | --color-feedback-neutral-high-icon | .icon-feedback-neutral-high | #171f22 | #171f22 | #1d1d1d | #1d1d1d |
| icon | --color-feedback-neutral-low-icon | .icon-feedback-neutral-low | #3f555e | #9fadb2 | #4f4f4f | #a9a9a9 |
| icon | --color-feedback-success-high-contrast-icon | .icon-feedback-success-high-contrast | #ffffff | #000000 | #ffffff | #000000 |
| icon | --color-feedback-success-high-icon | .icon-feedback-success-high | #003603 | #003603 | #003603 | #003603 |
| icon | --color-feedback-success-low-icon | .icon-feedback-success-low | #008207 | #45d24d | #008207 | #45d24d |
| icon | --color-feedback-warning-high-contrast-icon | .icon-feedback-warning-high-contrast | #ffffff | #000000 | #ffffff | #000000 |
| icon | --color-feedback-warning-high-icon | .icon-feedback-warning-high | #302300 | #302300 | #302300 | #302300 |
| icon | --color-feedback-warning-low-icon | .icon-feedback-warning-low | #805c00 | #e0a917 | #805c00 | #e0a917 |
| icon | --color-interaction-container-branded-high-icon | .icon-interaction-container-branded-high | #ffffff | #000000 | #ffffff | #000000 |
| icon | --color-interaction-container-branded-high-icon-active | .icon-interaction-container-branded-high-active | #ffffff | #000000 | #ffffff | #000000 |
| icon | --color-interaction-container-branded-high-icon-hover | .icon-interaction-container-branded-high-hover | #ffffff | #000000 | #ffffff | #000000 |
| icon | --color-interaction-container-branded-low-icon | .icon-interaction-container-branded-low | #1f717d | #258998 | #e75420 | #e75420 |
| icon | --color-interaction-container-branded-low-icon-active | .icon-interaction-container-branded-low-active | #185963 | #4b9eaa | #bf451a | #eb7247 |
| icon | --color-interaction-container-branded-low-icon-hover | .icon-interaction-container-branded-low-hover | #185963 | #4b9eaa | #bf451a | #eb7247 |
| icon | --color-interaction-container-neutral-icon | .icon-interaction-container-neutral | #617177 | #889499 | #6d6d6d | #808080 |
| icon | --color-interaction-container-neutral-icon-active | .icon-interaction-container-neutral-active | #185963 | #4b9eaa | #bf451a | #eb7247 |
| icon | --color-interaction-container-neutral-icon-hover | .icon-interaction-container-neutral-hover | #34464d | #bac1c4 | #414141 | #bfbfbf |
| icon | --color-interaction-link-high-icon | .icon-interaction-link-high | #1f717d | #258998 | #bf451a | #e75420 |
| icon | --color-interaction-link-high-icon-hover | .icon-interaction-link-high-hover | #185963 | #4b9eaa | #963715 | #eb7247 |
| icon | --color-interaction-link-high-icon-inactive | .icon-interaction-link-high-inactive | #617177 | #889499 | #6d6d6d | #808080 |
| icon | --color-interaction-link-high-icon-visited | .icon-interaction-link-high-visited | #185963 | #4b9eaa | #963715 | #eb7247 |
| icon | --color-interaction-link-inverted-icon | .icon-interaction-link-inverted | #889499 | #27353b | #919191 | #414141 |
| icon | --color-interaction-link-inverted-icon-disabled | .icon-interaction-link-inverted-disabled | #617177 | #3f555e | #6d6d6d | #6d6d6d |
| icon | --color-interaction-link-inverted-icon-hover | .icon-interaction-link-inverted-hover | #258998 | #1f717d | #e75420 | #bf451a |
| icon | --color-interaction-link-inverted-icon-visited | .icon-interaction-link-inverted-visited | #185963 | #4b9eaa | #963715 | #eb7247 |
| icon | --color-interaction-link-low-icon | .icon-interaction-link-low | #171f22 | #f5f6f7 | #1d1d1d | #f6f6f6 |
| icon | --color-interaction-link-low-icon-disabled | .icon-interaction-link-low-disabled | #617177 | #889499 | #6d6d6d | #808080 |
| icon | --color-interaction-link-low-icon-hover | .icon-interaction-link-low-hover | #185963 | #4b9eaa | #963715 | #eb7247 |
| icon | --color-interaction-link-low-icon-visited | .icon-interaction-link-low-visited | #185963 | #4b9eaa | #963715 | #eb7247 |
| icon | --color-rainbow-1-icon | .icon-rainbow-1 | #9c5311 | #f0801a | #9c5311 | #f0801a |
| icon | --color-rainbow-10-icon | .icon-rainbow-10 | #394d55 | #9fadb2 | #484848 | #a9a9a9 |
| icon | --color-rainbow-2-icon | .icon-rainbow-2 | #963715 | #eb7247 | #963715 | #eb7247 |
| icon | --color-rainbow-3-icon | .icon-rainbow-3 | #795c00 | #d29f00 | #795c00 | #d29f00 |
| icon | --color-rainbow-4-icon | .icon-rainbow-4 | #cc1d1d | #e79494 | #cc1d1d | #e79494 |
| icon | --color-rainbow-5-icon | .icon-rainbow-5 | #32504c | #84b8b1 | #32504c | #84b8b1 |
| icon | --color-rainbow-6-icon | .icon-rainbow-6 | #ab2d58 | #cf869f | #ab2d58 | #cf869f |
| icon | --color-rainbow-7-icon | .icon-rainbow-7 | #106f15 | #66b16a | #106f15 | #66b16a |
| icon | --color-rainbow-8-icon | .icon-rainbow-8 | #1f717d | #71b2bc | #1f717d | #71b2bc |
| icon | --color-rainbow-9-icon | .icon-rainbow-9 | #5c6e1f | #8da930 | #5c6e1f | #8da930 |
| text | --color-content-high-text | .text-high | #171f22 | #f5f6f7 | #1d1d1d | #f6f6f6 |
| text | --color-content-inverted-high-text | .text-inverted-high | #f5f6f7 | #0b0f11 | #f6f6f6 | #1d1d1d |
| text | --color-content-inverted-low-text | .text-inverted-low | #617177 | #3f555e | #6d6d6d | #6d6d6d |
| text | --color-content-inverted-medium-text | .text-inverted-medium | #889499 | #27353b | #919191 | #414141 |
| text | --color-content-low-text | .text-low | #617177 | #889499 | #6d6d6d | #808080 |
| text | --color-content-lower-text | .text-lower | #9fadb2 | #617177 | #a9a9a9 | #6d6d6d |
| text | --color-content-medium-text | .text-medium | #34464d | #bac1c4 | #414141 | #bfbfbf |
| text | --color-feedback-error-high-contrast-text | .text-feedback-error-high-contrast | #ffeded | #380101 | #ffeded | #380101 |
| text | --color-feedback-error-high-text | .text-feedback-error-high | #380101 | #380101 | #380101 | #380101 |
| text | --color-feedback-error-low-text | .text-feedback-error-low | #bb1919 | #ff6161 | #bb1919 | #ff6161 |
| text | --color-feedback-information-high-contrast-text | .text-feedback-information-high-contrast | #f0f6ff | #001c37 | #f0f6ff | #001c37 |
| text | --color-feedback-information-high-text | .text-feedback-information-high | #09285c | #09285c | #09285c | #09285c |
| text | --color-feedback-information-low-text | .text-feedback-information-low | #2660c2 | #659fff | #2660c2 | #659fff |
| text | --color-feedback-neutral-high-contrast-text | .text-feedback-neutral-high-contrast | #f5f6f7 | #0b0f11 | #f6f6f6 | #0e0e0e |
| text | --color-feedback-neutral-high-text | .text-feedback-neutral-high | #171f22 | #171f22 | #1d1d1d | #1d1d1d |
| text | --color-feedback-neutral-low-text | .text-feedback-neutral-low | #3f555e | #9fadb2 | #4f4f4f | #a9a9a9 |
| text | --color-feedback-success-high-contrast-text | .text-feedback-success-high-contrast | #eafeeb | #002302 | #eafeeb | #002302 |
| text | --color-feedback-success-high-text | .text-feedback-success-high | #003603 | #003603 | #003603 | #003603 |
| text | --color-feedback-success-low-text | .text-feedback-success-low | #008207 | #45d24d | #008207 | #45d24d |
| text | --color-feedback-warning-high-contrast-text | .text-feedback-warning-high-contrast | #fff7df | #302300 | #fff7df | #302300 |
| text | --color-feedback-warning-high-text | .text-feedback-warning-high | #302300 | #302300 | #302300 | #302300 |
| text | --color-feedback-warning-low-text | .text-feedback-warning-low | #805c00 | #e0a917 | #805c00 | #e0a917 |
| text | --color-interaction-container-branded-high-text | .text-interaction-container-branded-high | #ffffff | #000000 | #ffffff | #000000 |
| text | --color-interaction-container-branded-high-text-active | .text-interaction-container-branded-high-active | #ffffff | #000000 | #ffffff | #000000 |
| text | --color-interaction-container-branded-high-text-hover | .text-interaction-container-branded-high-hover | #ffffff | #000000 | #ffffff | #000000 |
| text | --color-interaction-container-branded-low-text | .text-interaction-container-branded-low | #1f717d | #258998 | #e75420 | #e75420 |
| text | --color-interaction-container-branded-low-text-active | .text-interaction-container-branded-low-active | #185963 | #4b9eaa | #bf451a | #eb7247 |
| text | --color-interaction-container-branded-low-text-hover | .text-interaction-container-branded-low-hover | #185963 | #4b9eaa | #bf451a | #eb7247 |
| text | --color-interaction-container-neutral-text | .text-interaction-container-neutral | #617177 | #889499 | #6d6d6d | #808080 |
| text | --color-interaction-container-neutral-text-active | .text-interaction-container-neutral-active | #185963 | #4b9eaa | #bf451a | #eb7247 |
| text | --color-interaction-container-neutral-text-hover | .text-interaction-container-neutral-hover | #34464d | #bac1c4 | #414141 | #bfbfbf |
| text | --color-interaction-link-high-text | .text-interaction-link-high | #1f717d | #258998 | #bf451a | #e75420 |
| text | --color-interaction-link-high-text-disabled | .text-interaction-link-high-disabled | #617177 | #889499 | #6d6d6d | #808080 |
| text | --color-interaction-link-high-text-hover | .text-interaction-link-high-hover | #185963 | #4b9eaa | #963715 | #eb7247 |
| text | --color-interaction-link-high-text-visited | .text-interaction-link-high-visited | #185963 | #4b9eaa | #963715 | #eb7247 |
| text | --color-interaction-link-inverted-text | .text-interaction-link-inverted | #889499 | #27353b | #919191 | #414141 |
| text | --color-interaction-link-inverted-text-hover | .text-interaction-link-inverted-hover | #258998 | #1f717d | #e75420 | #bf451a |
| text | --color-interaction-link-inverted-text-inactive | .text-interaction-link-inverted-inactive | #617177 | #3f555e | #6d6d6d | #6d6d6d |
| text | --color-interaction-link-inverted-text-visited | .text-interaction-link-inverted-visited | #185963 | #4b9eaa | #963715 | #eb7247 |
| text | --color-interaction-link-low-text | .text-interaction-link-low | #171f22 | #f5f6f7 | #1d1d1d | #f6f6f6 |
| text | --color-interaction-link-low-text-disabled | .text-interaction-link-low-disabled | #617177 | #889499 | #6d6d6d | #808080 |
| text | --color-interaction-link-low-text-hover | .text-interaction-link-low-hover | #185963 | #4b9eaa | #963715 | #eb7247 |
| text | --color-interaction-link-low-text-visited | .text-interaction-link-low-visited | #185963 | #4b9eaa | #963715 | #eb7247 |
| text | --color-rainbow-1-text | .text-rainbow-1 | #9c5311 | #f0801a | #9c5311 | #f39642 |
| text | --color-rainbow-10-text | .text-rainbow-10 | #394d55 | #9fadb2 | #484848 | #a9a9a9 |
| text | --color-rainbow-2-text | .text-rainbow-2 | #963715 | #eb7247 | #963715 | #eb7247 |
| text | --color-rainbow-3-text | .text-rainbow-3 | #795c00 | #d29f00 | #795c00 | #d29f00 |
| text | --color-rainbow-4-text | .text-rainbow-4 | #cc1d1d | #e79494 | #cc1d1d | #e79494 |
| text | --color-rainbow-5-text | .text-rainbow-5 | #32504c | #84b8b1 | #32504c | #84b8b1 |
| text | --color-rainbow-6-text | .text-rainbow-6 | #ab2d58 | #cf869f | #ab2d58 | #cf869f |
| text | --color-rainbow-7-text | .text-rainbow-7 | #106f15 | #66b16a | #106f15 | #66b16a |
| text | --color-rainbow-8-text | .text-rainbow-8 | #1f717d | #71b2bc | #1f717d | #71b2bc |
| text | --color-rainbow-9-text | .text-rainbow-9 | #5c6e1f | #8da930 | #5c6e1f | #8da930 |