#A9BCF5

#89ABE3

#6D82D1

#5359BF

#3A30A8

Cold Night

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%
	#89abe3	rgb(137, 171, 227)	hsl(220 62% 71%)	hwb(220 54% 11%)	lch(69.1 32.4 268)	lab(69.1 -1.37 -32.4)	cmyk 40%, 25%, 0%, 11%
	#6d82d1	rgb(109, 130, 209)	hsl(230 52% 62%)	hwb(230 43% 18%)	lch(55.3 44.7 281)	lab(55.3 8.66 -43.8)	cmyk 48%, 38%, 0%, 18%
	#5359bf	rgb(83, 89, 191)	hsl(240 46% 54%)	hwb(240 33% 25%)	lch(41.6 59.4 291)	lab(41.6 21.1 -55.5)	cmyk 57%, 53%, 0%, 25%
	#3a30a8	rgb(58, 48, 168)	hsl(250 56% 42%)	hwb(250 19% 34%)	lch(27.9 72.6 298)	lab(27.9 33.9 -64.3)	cmyk 65%, 71%, 0%, 34%

 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



#89ABE3

AA - 2.33



#6D82D1

AA - 3.64



#5359BF

AA - 5.91



#3A30A8

AAA - 9.68



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(73.7% -0.015 -0.089), oklab(62.5% 0.003 -0.122), oklab(51.4% 0.019 -0.156), oklab(40.6% 0.026 -0.181))

Fallback colors



--angle: 45deg; 
background: linear-gradient(var(--angle), #A9BCF5, #89ABE3, #6D82D1, #5359BF, #3A30A8)

Colors



<!-- Primary Colors -->
<color name="cold_night_color_10">#A9BCF5</color>
<color name="cold_night_color_20">#89ABE3</color>
<color name="cold_night_color_30">#6D82D1</color>
<color name="cold_night_color_40">#5359BF</color>
<color name="cold_night_color_50">#3A30A8</color>

Gradient PRO

Pro feature only

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

PWA prompt