Synthetic

#131C28

#303438

#454A4E

#818486

#BEB6B2

Actions

Explore the palette in different formats, and actions.

Colors overview

Grey

Black

Color	HEX	RGB	HSL	HWB	LCH	LAB	CMYK
	#131c28	rgb(19, 28, 40)	hsl(210 36% 12%)	hwb(210 7.5% 84%)	lch(9.84 9.65 263)	lab(9.84 -1.11 -9.58)	cmyk 53%, 30%, 0%, 84%
	#303438	rgb(48, 52, 56)	hsl(210 7.7% 20%)	hwb(210 19% 78%)	lch(21.4 3.32 252)	lab(21.4 -1.03 -3.16)	cmyk 14%, 7%, 0%, 78%
	#454a4e	rgb(69, 74, 78)	hsl(210 6.1% 29%)	hwb(210 27% 69%)	lch(31.1 3.43 246)	lab(31.1 -1.41 -3.13)	cmyk 12%, 5%, 0%, 69%
	#818486	rgb(129, 132, 134)	hsl(200 2% 52%)	hwb(200 51% 47%)	lch(54.9 1.72 240)	lab(54.9 -0.851 -1.49)	cmyk 4%, 1%, 0%, 47%
	#beb6b2	rgb(190, 182, 178)	hsl(20 8.5% 72%)	hwb(20 70% 25%)	lch(74.6 3.92 52.3)	lab(74.6 2.4 3.1)	cmyk 0%, 4%, 6%, 25%

 Click a color format to copy to your clipboard.

Contrast ratios checker

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

#131C28

AAA - 17.15



#303438

AAA - 12.54



#454A4E

AAA - 8.96



#818486

AA - 3.76



#BEB6B2

AA - 1.99



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(22.4% -0.007 -0.026), oklab(32.3% -0.003 -0.008), oklab(40.6% -0.004 -0.008), oklab(61.1% -0.003 -0.004), oklab(78.2% 0.007 0.008))

Fallback colors



background: linear-gradient(45deg, #131C28, #303438, #454A4E, #818486, #BEB6B2)

Colors



<!-- Primary Colors -->
<color name="synthetic_color_10">#131C28</color>
<color name="synthetic_color_20">#303438</color>
<color name="synthetic_color_30">#454A4E</color>
<color name="synthetic_color_40">#818486</color>
<color name="synthetic_color_50">#BEB6B2</color>

PWA prompt