Lenses

Actions

Explore the gradient in different formats, and actions.

Red

Black

Color	HEX	RGB	HSL	HWB	LCH	LAB	CMYK	Color schemes
	#1c1c1c	rgb(28, 28, 28)	hsl(none 0% 11%)	hwb(none 11% 89%)	lch(10.3 0 none)	lab(10.3 0 0)	cmyk 0%, 0%, 0%, 89%
	#2b040e	rgb(43, 4, 14)	hsl(340 83% 9.2%)	hwb(340 1.6% 83%)	lch(5.88 20.6 9.39)	lab(5.88 20.3 3.36)	cmyk 0%, 91%, 67%, 83%

 Click a color format to copy to your clipboard.

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

#1c1c1c

AAA - 17.04



#2b040e

AAA - 18.64



The simulation of color blindness may not be 100% accurate sometimes.

Colors preview as gradient with protanopia

Colors preview as palette with protanopia

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(22.6% 0 0), oklab(19.3% 0.065 0.011))

Fallback colors



--angle: 45deg; 
background: linear-gradient(var(--angle), #1c1c1c, #2b040e)

Colors



<!-- Primary Colors -->
<color name="lenses_color_10">#1c1c1c</color>
<color name="lenses_color_20">#2b040e</color>

Gradient PRO

Pro feature only

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

PWA prompt