01
#FBFDFCApp background
sage-1
Radix Sage 1- RGB
rgb(251 253 252)- Black text
- 20.56:1
- White text
- 1.02:1
← Back to color catalog
Green-neutral field study
Sage, catalogued as a living interface specimen.
A green-tinted neutral scale for interfaces built around mint, teal, jade, green and related natural accents. Follow all twelve official steps from quiet canvas to high-contrast text.
- Scale steps
- 01—12
- Documented roles
- 12
- Version
- 3.0.0
Pinned provenance
The exact opaque light Sage export, frozen at 3.0.0.
This page contains only Sage 1–12 from the opaque light sRGB export of @radix-ui/colors 3.0.0. Dark mode, alpha and P3 values are outside this reference.
Hexees is an independent reference and is not affiliated with or endorsed by WorkOS or Radix.
- Version
- @radix-ui/colors 3.0.0
- Source
- Versioned package export
- License
- MIT
Pressed specimens
Read one green cast across twelve interface roles.
Official source order is preserved. Each specimen keeps its exact sRGB value, documented role and calculated black-or-white text contrast visible.
02
#F7F9F8Subtle background
sage-2
Radix Sage 2- RGB
rgb(247 249 248)- Black text
- 19.86:1
- White text
- 1.06:1
03
#EEF1F0Component background
sage-3
Radix Sage 3- RGB
rgb(238 241 240)- Black text
- 18.48:1
- White text
- 1.14:1
04
#E6E9E8Hovered component
sage-4
Radix Sage 4- RGB
rgb(230 233 232)- Black text
- 17.19:1
- White text
- 1.22:1
05
#DFE2E0Active component
sage-5
Radix Sage 5- RGB
rgb(223 226 224)- Black text
- 16.09:1
- White text
- 1.30:1
06
#D7DAD9Subtle border
sage-6
Radix Sage 6- RGB
rgb(215 218 217)- Black text
- 14.92:1
- White text
- 1.41:1
07
#CBCFCDInteractive border
sage-7
Radix Sage 7- RGB
rgb(203 207 205)- Black text
- 13.35:1
- White text
- 1.57:1
08
#B8BCBAStrong border or focus ring
sage-8
Radix Sage 8- RGB
rgb(184 188 186)- Black text
- 10.94:1
- White text
- 1.92:1
09
#868E8BSolid background
sage-9
Radix Sage 9- RGB
rgb(134 142 139)- Black text
- 6.26:1
- White text
- 3.36:1
10
#7C8481Hovered solid background
sage-10
Radix Sage 10- RGB
rgb(124 132 129)- Black text
- 5.47:1
- White text
- 3.84:1
11
#5F6563Low-contrast text
sage-11
Radix Sage 11- RGB
rgb(95 101 99)- Black text
- 3.53:1
- White text
- 5.95:1
12
#1A211EHigh-contrast text
sage-12
Radix Sage 12- RGB
rgb(26 33 30)- Black text
- 1.28:1
- White text
- 16.40:1
Catalog scope
Twelve source values. No duplicate canonicals.
Production reconciliation found no existing exact-HEX canonical for this scale, so every Sage token retains Radix provenance. Individual detail pages stay noindex while this complete collection is discoverable.
Test actual typography, adjacent surfaces, borders, focus indicators and states. A token role and calculated text ratio are not an accessibility guarantee.
Open the contrast checker →Compare Radix Mauve →