Vivid · curated
Highlighter
Highlighter is a curated urgent, graphic, unmistakable system designed to move from expressive brand color to dependable surface and text roles.
Color values
Highlighter Primary · primary
HEX #FF3D3D
RGB 255, 61, 61
HSL 0°, 100%, 62%
On white 3.51:1 · on black 5.99:1
Highlighter Secondary · secondary
HEX #00C2FF
RGB 0, 194, 255
HSL 194°, 100%, 50%
On white 2.07:1 · on black 10.16:1
Highlighter Accent · accent
HEX #B9FF00
RGB 185, 255, 0
HSL 76°, 100%, 50%
On white 1.21:1 · on black 17.37:1
Highlighter Background · background
HEX #FCFCFA
RGB 252, 252, 250
HSL 60°, 25%, 98%
On white 1.03:1 · on black 20.44:1
Highlighter Text · text
HEX #101418
RGB 16, 20, 24
HSL 210°, 20%, 8%
On white 18.50:1 · on black 1.14:1
Text contrast between these colors
WCAG 2.2 asks for 4.5:1 for body text (AA), 3:1 for large text, and 7:1 for AAA. Strongest pairs first.
Need to fix a failing pair? Run it through the accessibility checker or browse more palettes.