Seaside

#A0D6B4

#E0FFFF

#87CEEB

#77B5FE

#F2D7EE

Actions

Explore the palette in different formats, and actions.

Colors overview

A breezy collection of pastels, reminiscent of a summer sky.

AI-generated description.

Blue

Green

Pink

Color	HEX	RGB	HSL	OKLAB HDR	OKLCH HDR	P3 HDR
	#a0d6b4	rgb(160, 214, 180)	hsl(140 40% 73%)	oklab(83% -0.07 0.03)	oklch(83% 0.07 160)	color(display-p3 0.67 0.83 0.72)
	#e0ffff	rgb(224, 255, 255)	hsl(180 100% 94%)	oklab(98% -0.03 -0.01)	oklch(98% 0.03 200)	color(display-p3 0.9 1 1)
	#87ceeb	rgb(135, 206, 235)	hsl(200 71% 73%)	oklab(81% -0.06 -0.06)	oklch(81% 0.08 230)	color(display-p3 0.59 0.8 0.91)
	#77b5fe	rgb(119, 181, 254)	hsl(210 99% 73%)	oklab(76% -0.04 -0.12)	oklch(76% 0.12 250)	color(display-p3 0.52 0.7 0.97)
	#f2d7ee	rgb(242, 215, 238)	hsl(310 51% 90%)	oklab(91% 0.04 -0.02)	oklch(91% 0.04 330)	color(display-p3 0.93 0.85 0.93)

 Click on a color value to copy it to your clipboard.

Contrast ratios checker

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

#A0D6B4

AA - 1.64



#E0FFFF

AA - 1.05



#87CEEB

AA - 1.74



#77B5FE

AA - 2.13



#F2D7EE

AA - 1.33



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(82.9% -0.067 0.029), oklab(97.8% -0.031 -0.009), oklab(81.5% -0.057 -0.059), oklab(76.1% -0.035 -0.119), oklab(90.8% 0.037 -0.021))

Fallback colors



background: linear-gradient(45deg, #A0D6B4, #E0FFFF, #87CEEB, #77B5FE, #F2D7EE)

Colors



<!-- Primary Colors -->
<color name="seaside_color_10">#A0D6B4</color>
<color name="seaside_color_20">#E0FFFF</color>
<color name="seaside_color_30">#87CEEB</color>
<color name="seaside_color_40">#77B5FE</color>
<color name="seaside_color_50">#F2D7EE</color>

PWA prompt