Bee

#08203a

#b2bcc7

#DDE6E8

#ffcc00

#fef0be

Actions

Explore the palette in different formats, and actions.

Colors overview

Yellow

Black

Grey

Color	HEX	RGB	HSL	OKLAB HDR	OKLCH HDR	P3 HDR
	#08203a	rgb(8, 32, 58)	hsl(210 76% 13%)	oklab(24% -0.02 -0.06)	oklch(24% 0.06 250)	color(display-p3 0.06 0.12 0.22)
	#b2bcc7	rgb(178, 188, 199)	hsl(210 16% 74%)	oklab(79% -0.01 -0.02)	oklch(79% 0.02 250)	color(display-p3 0.71 0.74 0.78)
	#dde6e8	rgb(221, 230, 232)	hsl(190 19% 89%)	oklab(92% -0.01 -0.01)	oklch(92% 0.01 210)	color(display-p3 0.87 0.9 0.91)
	#ffcc00	rgb(255, 204, 0)	hsl(48 100% 50%)	oklab(87% 0 0.18)	oklch(87% 0.18 90)	color(display-p3 0.97 0.81 0.27)
	#fef0be	rgb(254, 240, 190)	hsl(47 97% 87%)	oklab(95% 0 0.07)	oklch(95% 0.07 94)	color(display-p3 0.99 0.94 0.77)

 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.

#08203a

AAA - 16.43



#b2bcc7

AA - 1.92



#DDE6E8

AA - 1.26



#ffcc00

AA - 1.51



#fef0be

AA - 1.13



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(24.1% -0.017 -0.056), oklab(79.1% -0.006 -0.018), oklab(91.9% -0.008 -0.005), oklab(86.5% -0.001 0.177), oklab(95.4% -0.005 0.066))

Fallback colors



background: linear-gradient(45deg, #08203a, #b2bcc7, #DDE6E8, #ffcc00, #fef0be)

Colors



<!-- Primary Colors -->
<color name="bee__color_10">#08203a</color>
<color name="bee__color_20">#b2bcc7</color>
<color name="bee__color_30">#DDE6E8</color>
<color name="bee__color_40">#ffcc00</color>
<color name="bee__color_50">#fef0be</color>

PWA prompt