#E54D2Etomato
tomato-9
Radix Tomato 9Copy CSS, HEX, or RGB
- HSL
hsl(10 78% 54%)- HWB
hwb(10 18% 10%)- Black text
- 5.43:1
- White text
- 3.87:1
Versioned solid-accent reference
Radix Colors 3 step-9 solid accents
Compare the 25 accent-family values assigned to step 9 in the opaque light scales. Search by token or value, copy ready-made CSS, and check the exact text pair before using an accent as a solid surface.
- 25accent-family anchors
- 9shared source step
- 24 + 1Radix-owned plus one canonical join
Source and scope
One documented role from one pinned package version.
This page extracts only the 25 opaque light accent-family tokens ending in -9 from @radix-ui/colors 3.0.0. Radix documents step 9 as the solid-background anchor. Neutral families, other steps, dark scales, alpha values, and display-P3 exports are deliberately outside this page.
Hexees is an independent reference and is not affiliated with or endorsed by WorkOS, Radix, or the Radix Colors project.
- Version
- @radix-ui/colors 3.0.0
- License
- MIT License
Practical lookup
Compare all 25 solid accent anchors.
Search and sorting run locally and do not create parameter pages. Source order preserves the frozen artifact sequence; hue and localized-name sorting are optional viewing tools.
25 of 25 solid accents match
#E5484Dred
red-9
Radix Red 9Copy CSS, HEX, or RGB
- HSL
hsl(358 75% 59%)- HWB
hwb(358 28% 10%)- Black text
- 5.37:1
- White text
- 3.91:1
#E54666ruby
ruby-9
Radix Ruby 9Copy CSS, HEX, or RGB
- HSL
hsl(348 75% 59%)- HWB
hwb(348 27% 10%)- Black text
- 5.40:1
- White text
- 3.89:1
#E93D82crimson
crimson-9
Radix Crimson 9Copy CSS, HEX, or RGB
- HSL
hsl(336 80% 58%)- HWB
hwb(336 24% 9%)- Black text
- 5.45:1
- White text
- 3.85:1
#D6409Fpink
pink-9
Radix Pink 9Copy CSS, HEX, or RGB
- HSL
hsl(322 65% 55%)- HWB
hwb(322 25% 16%)- Black text
- 5.09:1
- White text
- 4.12:1
#AB4ABAplum
plum-9
Radix Plum 9Copy CSS, HEX, or RGB
- HSL
hsl(292 45% 51%)- HWB
hwb(292 29% 27%)- Black text
- 4.42:1
- White text
- 4.75:1
#8E4EC6purple
purple-9
Radix Purple 9Copy CSS, HEX, or RGB
- HSL
hsl(272 51% 54%)- HWB
hwb(272 31% 22%)- Black text
- 4.06:1
- White text
- 5.18:1
#6E56CFviolet
violet-9
Radix Violet 9Copy CSS, HEX, or RGB
- HSL
hsl(252 56% 57%)- HWB
hwb(252 34% 19%)- Black text
- 3.90:1
- White text
- 5.39:1
#5B5BD6iris
iris-9
Radix Iris 9Copy CSS, HEX, or RGB
- HSL
hsl(240 60% 60%)- HWB
hwb(240 36% 16%)- Black text
- 3.91:1
- White text
- 5.37:1
#3E63DDindigo
indigo-9
Radix Indigo 9Copy CSS, HEX, or RGB
- HSL
hsl(226 70% 55%)- HWB
hwb(226 24% 13%)- Black text
- 4.03:1
- White text
- 5.21:1
#0090FFblue
blue-9
Radix Blue 9Copy CSS, HEX, or RGB
- HSL
hsl(206 100% 50%)- HWB
hwb(206 0% 0%)- Black text
- 6.43:1
- White text
- 3.26:1
#00A2C7cyan
cyan-9
Radix Cyan 9Copy CSS, HEX, or RGB
- HSL
hsl(191 100% 39%)- HWB
hwb(191 0% 22%)- Black text
- 6.99:1
- White text
- 3.00:1
#12A594teal
teal-9
Radix Teal 9Copy CSS, HEX, or RGB
- HSL
hsl(173 80% 36%)- HWB
hwb(173 7% 35%)- Black text
- 6.84:1
- White text
- 3.07:1
#29A383jade
jade-9
Radix Jade 9Copy CSS, HEX, or RGB
- HSL
hsl(164 60% 40%)- HWB
hwb(164 16% 36%)- Black text
- 6.66:1
- White text
- 3.15:1
#30A46Cgreen
green-9
Radix Green 9Copy CSS, HEX, or RGB
- HSL
hsl(151 55% 42%)- HWB
hwb(151 19% 36%)- Black text
- 6.65:1
- White text
- 3.16:1
#46A758grass
grass-9
Radix Grass 9Copy CSS, HEX, or RGB
- HSL
hsl(131 41% 46%)- HWB
hwb(131 27% 35%)- Black text
- 6.93:1
- White text
- 3.03:1
#AD7F58brown
brown-9
Radix Brown 9Copy CSS, HEX, or RGB
- HSL
hsl(28 34% 51%)- HWB
hwb(28 35% 32%)- Black text
- 5.95:1
- White text
- 3.53:1
#A18072bronze
bronze-9
Radix Bronze 9Copy CSS, HEX, or RGB
- HSL
hsl(18 20% 54%)- HWB
hwb(18 45% 37%)- Black text
- 5.85:1
- White text
- 3.59:1
#978365gold
gold-9
Radix Gold 9Copy CSS, HEX, or RGB
- HSL
hsl(36 20% 49%)- HWB
hwb(36 40% 41%)- Black text
- 5.75:1
- White text
- 3.65:1
#7CE2FEsky
sky-9
Radix Sky 9Copy CSS, HEX, or RGB
- HSL
hsl(193 98% 74%)- HWB
hwb(193 49% 0%)- Black text
- 14.17:1
- White text
- 1.48:1
#86EAD4mint
mint-9
Radix Mint 9Copy CSS, HEX, or RGB
- HSL
hsl(167 70% 72%)- HWB
hwb(167 53% 8%)- Black text
- 14.73:1
- White text
- 1.43:1
#BDEE63lime
lime-9
Radix Lime 9Copy CSS, HEX, or RGB
- HSL
hsl(81 80% 66%)- HWB
hwb(81 39% 7%)- Black text
- 15.57:1
- White text
- 1.35:1
#FFE629yellow
yellow-9
Radix Yellow 9Copy CSS, HEX, or RGB
- HSL
hsl(53 100% 58%)- HWB
hwb(53 16% 0%)- Black text
- 16.60:1
- White text
- 1.26:1
#FFC53Damber
amber-9
Bright golden orange — Ant gold 5Copy CSS, HEX, or RGB
- HSL
hsl(42 100% 62%)- HWB
hwb(42 24% 0%)- Black text
- 13.31:1
- White text
- 1.58:1
#F76B15orange
orange-9
Radix Orange 9Copy CSS, HEX, or RGB
- HSL
hsl(23 93% 53%)- HWB
hwb(23 8% 3%)- Black text
- 7.07:1
- White text
- 2.97:1
Canonical reuse
amber-9 reuses an existing reviewed color.
The exact #FFC53D value already belongs to the Ant Design ant-gold-5 canonical record. Hexees links the Radix token to that record instead of creating a duplicate page; the other 24 values keep Radix provenance.
- amber-9#FFC53D
- canonical recordant-gold-5
Accessibility limits
A solid-accent role is not an accessibility guarantee.
Each card calculates contrast only between the exact opaque sRGB value and black or white text. WCAG 2.2 AA requires 4.5:1 for normal text and 3:1 for large text, but the result describes only that pair.
Test the actual component, typography, adjacent colors, borders, focus indicators, hover, selected and disabled states. Do not rely on color alone for status or required action.