Beach

#73A7C9

#A1C4A9

#F4EBD0

#F2D7B0

#E8A87C

Actions

Explore the palette in different formats, and actions.

Colors overview

Blue

Green

Orange

Color	HEX	RGB	HSL	HWB	LCH	LAB	CMYK
	#73a7c9	rgb(115, 167, 201)	hsl(200 44% 62%)	hwb(200 45% 21%)	lch(65.8 25.7 244)	lab(65.8 -11.1 -23.2)	cmyk 43%, 17%, 0%, 21%
	#a1c4a9	rgb(161, 196, 169)	hsl(130 23% 70%)	hwb(130 63% 23%)	lch(76 18.8 149)	lab(76 -16.2 9.54)	cmyk 18%, 0%, 14%, 23%
	#f4ebd0	rgb(244, 235, 208)	hsl(45 62% 89%)	hwb(45 82% 4.3%)	lch(93.2 14.3 90.4)	lab(93.2 -0.109 14.3)	cmyk 0%, 4%, 15%, 4%
	#f2d7b0	rgb(242, 215, 176)	hsl(35 72% 82%)	hwb(35 69% 5.1%)	lch(87.5 23.6 76.6)	lab(87.5 5.44 22.9)	cmyk 0%, 11%, 27%, 5%
	#e8a87c	rgb(232, 168, 124)	hsl(24 70% 70%)	hwb(24 49% 9%)	lch(74.3 38.4 57.7)	lab(74.3 20.5 32.5)	cmyk 0%, 28%, 47%, 9%

 Click a color format to copy to your clipboard.

Contrast ratios checker

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

#73A7C9

AA - 2.59



#A1C4A9

AA - 1.91



#F4EBD0

AA - 1.19



#F2D7B0

AA - 1.38



#E8A87C

AA - 2.03



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(70.5% -0.04 -0.063), oklab(78.7% -0.047 0.025), oklab(94% -0.001 0.037), oklab(89.2% 0.013 0.058), oklab(78.2% 0.054 0.079))

Fallback colors



background: linear-gradient(45deg, #73A7C9, #A1C4A9, #F4EBD0, #F2D7B0, #E8A87C)

Colors



<!-- Primary Colors -->
<color name="beach_color_10">#73A7C9</color>
<color name="beach_color_20">#A1C4A9</color>
<color name="beach_color_30">#F4EBD0</color>
<color name="beach_color_40">#F2D7B0</color>
<color name="beach_color_50">#E8A87C</color>

PWA prompt