#A9BCF5

#89A5E1

#6D86CA

#5167B3

#34499B

Skyfall

Actions

Explore the gradient in different formats, and actions.

Colors overview

Blue

Color	HEX	RGB	HSL	HWB	LCH	LAB	CMYK
	#a9bcf5	rgb(169, 188, 245)	hsl(230 79% 81%)	hwb(230 66% 3.9%)	lch(76.3 30.9 276)	lab(76.3 3.03 -30.7)	cmyk 31%, 23%, 0%, 4%
	#89a5e1	rgb(137, 165, 225)	hsl(220 59% 71%)	hwb(220 54% 12%)	lch(67.4 33.9 272)	lab(67.4 1.31 -33.9)	cmyk 39%, 27%, 0%, 12%
	#6d86ca	rgb(109, 134, 202)	hsl(220 47% 61%)	hwb(220 43% 21%)	lch(56.2 38.9 277)	lab(56.2 4.78 -38.6)	cmyk 46%, 34%, 0%, 21%
	#5167b3	rgb(81, 103, 179)	hsl(230 39% 51%)	hwb(230 32% 30%)	lch(44.6 44.7 282)	lab(44.6 9.07 -43.7)	cmyk 55%, 42%, 0%, 30%
	#34499b	rgb(52, 73, 155)	hsl(230 50% 41%)	hwb(230 20% 39%)	lch(33 50.1 286)	lab(33 13.6 -48.3)	cmyk 66%, 53%, 0%, 39%

 Click a color format to copy to your clipboard.

Contrast ratios checker

Click one color card to view the complete contrast checker tests.

#A9BCF5

AA - 1.87



#89A5E1

AA - 2.46



#6D86CA

AA - 3.55



#5167B3

AA - 5.32



#34499B

AAA - 8.16



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.



32°

CPU



48°

GPU



100%

Usage



11°

Rain



70%

Storage

HDR color space

HDR oklab colors



--angle: 45deg; 
background: linear-gradient(var(--angle), oklab(80.1% 0 -0.084), oklab(72.4% -0.008 -0.093), oklab(62.9% -0.004 -0.107), oklab(53.3% -0.001 -0.122), oklab(43.6% -0.002 -0.136))

Fallback colors



--angle: 45deg; 
background: linear-gradient(var(--angle), #A9BCF5, #89A5E1, #6D86CA, #5167B3, #34499B)

Colors



<!-- Primary Colors -->
<color name="skyfall_color_10">#A9BCF5</color>
<color name="skyfall_color_20">#89A5E1</color>
<color name="skyfall_color_30">#6D86CA</color>
<color name="skyfall_color_40">#5167B3</color>
<color name="skyfall_color_50">#34499B</color>

Gradient PRO

Pro feature only

Get access to all app tokens, export files, and more.

PWA prompt