#e1b4b2

#f6eae9

#ffffff

#e9f6f6

#b3dee0

Peace

#e1b4b2

#f6eae9

#ffffff

#e9f6f6

#b3dee0



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

Orange

White

Cyan

Color	HEX	RGB	HSL	HWB	LCH	LAB	CMYK
	#e1b4b2	rgb(225, 180, 178)	hsl(2.6 44% 79%)	hwb(2.6 70% 12%)	lch(77.4 18.2 24.5)	lab(77.4 16.6 7.55)	cmyk 0%, 20%, 21%, 12%
	#f6eae9	rgb(246, 234, 233)	hsl(4.6 42% 94%)	hwb(4.6 91% 3.5%)	lch(93.6 4.54 26.3)	lab(93.6 4.07 2.01)	cmyk 0%, 5%, 5%, 4%
	#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%
	#e9f6f6	rgb(233, 246, 246)	hsl(180 42% 94%)	hwb(180 91% 3.5%)	lch(95.9 4.7 199)	lab(95.9 -4.43 -1.56)	cmyk 5%, 0%, 0%, 4%
	#b3dee0	rgb(179, 222, 224)	hsl(180 42% 79%)	hwb(180 70% 12%)	lch(85.5 15.3 202)	lab(85.5 -14.2 -5.86)	cmyk 20%, 1%, 0%, 12%

 Click a color format to copy to your clipboard.

Contrast ratios checker

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

#e1b4b2

AA - 1.84



#f6eae9

AA - 1.17



#ffffff

AA - 1



#e9f6f6

AA - 1.1



#b3dee0

AA - 1.45



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(81% 0.049 0.019), oklab(94.6% 0.012 0.005), oklab(100% 0 0), oklab(96.3% -0.013 -0.004), oklab(87.1% -0.042 -0.015))

Fallback colors



background: linear-gradient(45deg, #e1b4b2, #f6eae9, #ffffff, #e9f6f6, #b3dee0)

Colors



<!-- Primary Colors -->
<color name="peace_color_10">#e1b4b2</color>
<color name="peace_color_20">#f6eae9</color>
<color name="peace_color_30">#ffffff</color>
<color name="peace_color_40">#e9f6f6</color>
<color name="peace_color_50">#b3dee0</color>

PWA prompt