Vehicle

#363437

#6d3945

#848686

#c9ced0

#314a64

Actions

Explore the palette in different formats, and actions.

Colors overview

Grey

Blue

Red

Color	HEX	RGB	HSL	OKLAB HDR	OKLCH HDR	P3 HDR
	#363437	rgb(54, 52, 55)	hsl(280 2.8% 21%)	oklab(33% 0 0)	oklch(33% 0.01 310)	color(display-p3 0.21 0.2 0.21)
	#6d3945	rgb(109, 57, 69)	hsl(350 31% 33%)	oklab(41% 0.07 0.01)	oklch(41% 0.07 6.1)	color(display-p3 0.4 0.23 0.27)
	#848686	rgb(132, 134, 134)	hsl(180 0.82% 52%)	oklab(62% 0 0)	oklch(62% 0 200)	color(display-p3 0.52 0.53 0.53)
	#c9ced0	rgb(201, 206, 208)	hsl(200 6.9% 80%)	oklab(85% 0 0)	oklch(85% 0.01 220)	color(display-p3 0.79 0.81 0.81)
	#314a64	rgb(49, 74, 100)	hsl(210 34% 29%)	oklab(40% -0.02 -0.05)	oklch(40% 0.05 250)	color(display-p3 0.21 0.29 0.38)

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

#363437

AAA - 12.32



#6d3945

AAA - 9.04



#848686

AA - 3.66



#c9ced0

AA - 1.58



#314a64

AAA - 9.15



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(32.8% 0.004 -0.004), oklab(41.4% 0.074 0.008), oklab(61.8% -0.002 -0.001), oklab(84.8% -0.004 -0.004), oklab(40.1% -0.018 -0.051))

Fallback colors



background: linear-gradient(45deg, #363437, #6d3945, #848686, #c9ced0, #314a64)

Colors



<!-- Primary Colors -->
<color name="vehicle_color_10">#363437</color>
<color name="vehicle_color_20">#6d3945</color>
<color name="vehicle_color_30">#848686</color>
<color name="vehicle_color_40">#c9ced0</color>
<color name="vehicle_color_50">#314a64</color>

PWA prompt