Sky Orange

#af6647

#c9927b

#d8b09f

#7db3ca

#4791b0

Actions

Explore the palette in different formats, and actions.

Colors overview

Cyan

Orange

Color	HEX	RGB	HSL	OKLAB HDR	OKLCH HDR	P3 HDR
	#af6647	rgb(175, 102, 71)	hsl(18 42% 48%)	oklab(59% 0.08 0.07)	oklch(59% 0.1 43)	color(display-p3 0.65 0.41 0.3)
	#c9927b	rgb(201, 146, 123)	hsl(18 42% 64%)	oklab(71% 0.05 0.05)	oklch(71% 0.07 44)	color(display-p3 0.76 0.58 0.5)
	#d8b09f	rgb(216, 176, 159)	hsl(18 42% 74%)	oklab(79% 0.04 0.04)	oklch(79% 0.05 44)	color(display-p3 0.82 0.7 0.63)
	#7db3ca	rgb(125, 179, 202)	hsl(200 42% 64%)	oklab(74% -0.05 -0.05)	oklch(74% 0.07 230)	color(display-p3 0.54 0.7 0.78)
	#4791b0	rgb(71, 145, 176)	hsl(200 43% 48%)	oklab(62% -0.06 -0.06)	oklch(62% 0.09 230)	color(display-p3 0.35 0.56 0.68)

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

#af6647

AA - 4.36



#c9927b

AA - 2.66



#d8b09f

AA - 1.97



#7db3ca

AA - 2.28



#4791b0

AA - 3.53



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(58.5% 0.076 0.072), oklab(70.7% 0.054 0.052), oklab(78.8% 0.038 0.037), oklab(73.7% -0.045 -0.047), oklab(62.2% -0.058 -0.065))

Fallback colors



background: linear-gradient(45deg, #af6647, #c9927b, #d8b09f, #7db3ca, #4791b0)

Colors



<!-- Primary Colors -->
<color name="sky_orange_color_10">#af6647</color>
<color name="sky_orange_color_20">#c9927b</color>
<color name="sky_orange_color_30">#d8b09f</color>
<color name="sky_orange_color_40">#7db3ca</color>
<color name="sky_orange_color_50">#4791b0</color>

PWA prompt