#455a64

#607d8b

#ffffff

#ffc107

#212121

Grey/Yellow

#455a64

#607d8b

#ffffff

#ffc107

#212121



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

Grey

Yellow

Color	HEX	RGB	HSL	HWB	LCH	LAB	CMYK
	#455a64	rgb(69, 90, 100)	hsl(200 18% 33%)	hwb(200 27% 61%)	lch(36.8 10.6 234)	lab(36.8 -6.29 -8.53)	cmyk 31%, 10%, 0%, 61%
	#607d8b	rgb(96, 125, 139)	hsl(200 18% 46%)	hwb(200 38% 45%)	lch(50.5 13.8 234)	lab(50.5 -8.12 -11.2)	cmyk 31%, 10%, 0%, 45%
	#ffffff	rgb(255, 255, 255)	hsl(none 0% 100%)	hwb(none 100% 0%)	lch(100 0 none)	lab(100 0 0)	cmyk 0%, 0%, 0%, 0%
	#ffc107	rgb(255, 193, 7)	hsl(45 100% 51%)	hwb(45 2.7% 0%)	lch(82.1 83.6 80.6)	lab(82.1 13.7 82.4)	cmyk 0%, 24%, 97%, 0%
	#212121	rgb(33, 33, 33)	hsl(none 0% 13%)	hwb(none 13% 87%)	lch(12.7 0 none)	lab(12.7 0 0)	cmyk 0%, 0%, 0%, 87%

 Click a color format to copy to your clipboard.

Contrast ratios checker

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

#455a64

AAA - 7.24



#607d8b

AA - 4.37



#ffffff

AA - 1



#ffc107

AA - 1.63



#212121

AAA - 16.1



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(45.4% -0.02 -0.023), oklab(57.2% -0.026 -0.03), oklab(100% 0 0), oklab(84.4% 0.015 0.171), oklab(24.8% 0 0))

Fallback colors



background: linear-gradient(45deg, #455a64, #607d8b, #ffffff, #ffc107, #212121)

Colors



<!-- Primary Colors -->
<color name="grey/yellow_color_10">#455a64</color>
<color name="grey/yellow_color_20">#607d8b</color>
<color name="grey/yellow_color_30">#ffffff</color>
<color name="grey/yellow_color_40">#ffc107</color>
<color name="grey/yellow_color_50">#212121</color>

PWA prompt