#c11ceb

#6f19b5

#25007a

Database



Web code

Get CSS, SCSS, & Tailwind code for development



App tokens

Get Android, Flutter, Swift, & MAUI tokens



HDR gradient

Switch to HDR to enhance the gradient



Quick view

Inspect colors in multiple color spaces

Colors overview

Purple

Color	HEX	RGB	HSL	HWB	LCH	LAB	CMYK
	#c11ceb	rgb(193, 28, 235)	hsl(290 84% 52%)	hwb(290 11% 7.8%)	lch(49.2 103 319)	lab(49.2 77.7 -67.7)	cmyk 18%, 88%, 0%, 8%
	#6f19b5	rgb(111, 25, 181)	hsl(270 76% 40%)	hwb(270 9.8% 29%)	lch(31.9 85.9 311)	lab(31.9 55.9 -65.3)	cmyk 39%, 86%, 0%, 29%
	#25007a	rgb(37, 0, 122)	hsl(260 100% 24%)	hwb(260 0% 52%)	lch(13.2 73 304)	lab(13.2 41.2 -60.2)	cmyk 70%, 100%, 0%, 52%

 Click a color format to copy to your clipboard.

Contrast ratios checker

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

#c11ceb

AA - 4.53



#6f19b5

AAA - 8.46



#25007a

AAA - 15.44



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(60.4% 0.207 -0.19), oklab(44.9% 0.117 -0.184), oklab(28.4% 0.031 -0.168))

Fallback colors



--angle: 45deg; 
background: linear-gradient(var(--angle), #c11ceb, #6f19b5, #25007a)

Colors



<!-- Primary Colors -->
<color name="database_color_10">#c11ceb</color>
<color name="database_color_20">#6f19b5</color>
<color name="database_color_30">#25007a</color>

Gradient PRO

Pro feature only

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

PWA prompt