Mirrorball

#FFFFFF

#F0F0F0

#D3D3D3

#C0C0C0

#A9A9A9

Actions

Explore the palette in different formats, and actions.

Colors overview

A symphony of serene grays, whispering sophistication, and understated elegance.

AI-generated description.

White

Grey

Color	HEX	RGB	HSL	OKLAB HDR	OKLCH HDR	P3 HDR
	#ffffff	rgb(255, 255, 255)	hsl(none 0% 100%)	oklab(100% 0 0)	oklch(100% 0 none)	color(display-p3 1 1 1)
	#f0f0f0	rgb(240, 240, 240)	hsl(none 0% 94%)	oklab(96% 0 0)	oklch(96% 0 none)	color(display-p3 0.94 0.94 0.94)
	#d3d3d3	rgb(211, 211, 211)	hsl(none 0% 83%)	oklab(87% 0 0)	oklch(87% 0 none)	color(display-p3 0.83 0.83 0.83)
	#c0c0c0	rgb(192, 192, 192)	hsl(none 0% 75%)	oklab(81% 0 0)	oklch(81% 0 none)	color(display-p3 0.75 0.75 0.75)
	#a9a9a9	rgb(169, 169, 169)	hsl(none 0% 66%)	oklab(73% 0 0)	oklch(73% 0 none)	color(display-p3 0.66 0.66 0.66)

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

#FFFFFF

AA - 1



#F0F0F0

AA - 1.13



#D3D3D3

AA - 1.49



#C0C0C0

AA - 1.81



#A9A9A9

AA - 2.35



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(100% 0 0), oklab(95.5% 0 0), oklab(86.7% 0 0), oklab(80.8% 0 0), oklab(73.5% 0 0))

Fallback colors



background: linear-gradient(45deg, #FFFFFF, #F0F0F0, #D3D3D3, #C0C0C0, #A9A9A9)

Colors



<!-- Primary Colors -->
<color name="mirrorball_color_10">#FFFFFF</color>
<color name="mirrorball_color_20">#F0F0F0</color>
<color name="mirrorball_color_30">#D3D3D3</color>
<color name="mirrorball_color_40">#C0C0C0</color>
<color name="mirrorball_color_50">#A9A9A9</color>

PWA prompt