#454545

#4b89db

#96caf5

#c4c4c4

#e8db2c

Bird

#454545

#4b89db

#96caf5

#c4c4c4

#e8db2c



Web code

Get CSS, SCSS, & Tailwind code for development



App tokens

Get Android, Flutter, Swift, & MAUI tokens



Quick view

Inspect colors in multiple color spaces

Colors overview

Blue

Yellow

Color	HEX	RGB	HSL	HWB	LCH	LAB	CMYK
	#454545	rgb(69, 69, 69)	hsl(none 0% 27%)	hwb(none 27% 73%)	lch(29.3 0 none)	lab(29.3 0 0)	cmyk 0%, 0%, 0%, 73%
	#4b89db	rgb(75, 137, 219)	hsl(210 67% 58%)	hwb(210 29% 14%)	lch(55.9 48.8 269)	lab(55.9 -0.475 -48.8)	cmyk 66%, 37%, 0%, 14%
	#96caf5	rgb(150, 202, 245)	hsl(210 83% 77%)	hwb(210 59% 3.9%)	lch(78.8 28.7 251)	lab(78.8 -9.52 -27)	cmyk 39%, 18%, 0%, 4%
	#c4c4c4	rgb(196, 196, 196)	hsl(none 0% 77%)	hwb(none 77% 23%)	lch(79.2 0 none)	lab(79.2 0 0)	cmyk 0%, 0%, 0%, 23%
	#e8db2c	rgb(232, 219, 44)	hsl(56 80% 54%)	hwb(56 17% 9%)	lch(86.4 78.7 95.9)	lab(86.4 -8.12 78.3)	cmyk 0%, 6%, 81%, 9%

 Click a color format to copy to your clipboard.

Contrast ratios checker

Click one color card to view the complete contrast checker tests.

#454545

AAA - 9.58



#4b89db

AA - 3.55



#96caf5

AA - 1.74



#c4c4c4

AA - 1.74



#e8db2c

AA - 1.43



Color blindness

The simulation of color blindness may not be 100% accurate sometimes.

Colors preview as gradient with protanopia

Colors preview as palette with protanopia

UI components preview

Preview the gradient in different UI components.

HDR color space

HDR oklab colors



background: linear-gradient(45deg, oklab(39% 0 0), oklab(62.7% -0.034 -0.136), oklab(81.8% -0.036 -0.073), oklab(82% 0 0), oklab(87.5% -0.045 0.17))

Fallback colors



background: linear-gradient(45deg, #454545, #4b89db, #96caf5, #c4c4c4, #e8db2c)

Colors



<!-- Primary Colors -->
<color name="bird_color_10">#454545</color>
<color name="bird_color_20">#4b89db</color>
<color name="bird_color_30">#96caf5</color>
<color name="bird_color_40">#c4c4c4</color>
<color name="bird_color_50">#e8db2c</color>

PWA prompt