Port

#595959

#918e8e

#f5f5d7

#ffcea6

#ed974c

Actions

Explore the palette in different formats, and actions.

Colors overview

Grey

Orange

Color	HEX	RGB	HSL	OKLAB HDR	OKLCH HDR	P3 HDR
	#595959	rgb(89, 89, 89)	hsl(none 0% 35%)	oklab(46% 0 0)	oklch(46% 0 none)	color(display-p3 0.35 0.35 0.35)
	#918e8e	rgb(145, 142, 142)	hsl(0 1.3% 56%)	oklab(65% 0 0)	oklch(65% 0 17)	color(display-p3 0.57 0.56 0.56)
	#f5f5d7	rgb(245, 245, 215)	hsl(60 60% 90%)	oklab(96% -0.01 0.04)	oklch(96% 0.04 110)	color(display-p3 0.96 0.96 0.85)
	#ffcea6	rgb(255, 206, 166)	hsl(27 100% 83%)	oklab(88% 0.04 0.07)	oklch(88% 0.08 61)	color(display-p3 0.97 0.82 0.67)
	#ed974c	rgb(237, 151, 76)	hsl(28 82% 61%)	oklab(75% 0.07 0.12)	oklch(75% 0.14 59)	color(display-p3 0.88 0.61 0.35)

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

#595959

AAA - 7



#918e8e

AA - 3.24



#f5f5d7

AA - 1.1



#ffcea6

AA - 1.43



#ed974c

AA - 2.29



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(46.4% 0 0), oklab(64.9% 0.003 0.001), oklab(96.2% -0.012 0.038), oklab(88.5% 0.037 0.067), oklab(75% 0.07 0.118))

Fallback colors



background: linear-gradient(45deg, #595959, #918e8e, #f5f5d7, #ffcea6, #ed974c)

Colors



<!-- Primary Colors -->
<color name="port_color_10">#595959</color>
<color name="port_color_20">#918e8e</color>
<color name="port_color_30">#f5f5d7</color>
<color name="port_color_40">#ffcea6</color>
<color name="port_color_50">#ed974c</color>

PWA prompt