#7d0863

#a1088f

#cd47c8

Berry Smoothie



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

Pink

Color	HEX	RGB	HSL	HWB	LCH	LAB	CMYK
	#7d0863	rgb(125, 8, 99)	hsl(310 88% 26%)	hwb(310 3.1% 51%)	lch(28.1 55 338)	lab(28.1 51.1 -20.3)	cmyk 0%, 94%, 21%, 51%
	#a1088f	rgb(161, 8, 143)	hsl(310 91% 33%)	hwb(310 3.1% 37%)	lch(37.4 71.5 333)	lab(37.4 63.5 -32.9)	cmyk 0%, 95%, 11%, 37%
	#cd47c8	rgb(205, 71, 200)	hsl(300 57% 54%)	hwb(300 28% 20%)	lch(53.6 76.1 328)	lab(53.6 64.3 -40.6)	cmyk 0%, 65%, 2%, 20%

 Click a color format to copy to your clipboard.

Contrast ratios checker

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

#7d0863

AAA - 10.06



#a1088f

AAA - 7.12



#cd47c8

AA - 3.93



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(40.1% 0.158 -0.056), oklab(48.9% 0.193 -0.092), oklab(62.9% 0.19 -0.113))

Fallback colors



--angle: 45deg; 
background: linear-gradient(var(--angle), #7d0863, #a1088f, #cd47c8)

Colors



<!-- Primary Colors -->
<color name="berry_smoothie_color_10">#7d0863</color>
<color name="berry_smoothie_color_20">#a1088f</color>
<color name="berry_smoothie_color_30">#cd47c8</color>

Gradient PRO

Pro feature only

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

PWA prompt