warmmonochromevibrant
Berry Smoothie Color Palette
Berry Smoothie is a warm, monochrome and vibrant color palette of 5 colors: Oxblood (#590d22), Brown (#a4133c), Watermelon (#ff4d6d), Flamingo (#ff8fa3) and Bubblegum (#ffccd5). Its dominant hue is pink.
The darkest color, Oxblood, on the lightest, Bubblegum, gives a 9.86:1 contrast ratio — enough for body text at WCAG AAA. 3 pairs in this palette pass AA for normal text. Watermelon (#ff4d6d) is its most saturated color and a natural choice for buttons and links.
Colors
- Oxblood
- Brown
- Watermelon
- Flamingo
- Bubblegum
CSS Output
:root {
--berry-smoothie-1: #590d22;
--berry-smoothie-2: #a4133c;
--berry-smoothie-3: #ff4d6d;
--berry-smoothie-4: #ff8fa3;
--berry-smoothie-5: #ffccd5;
}Berry Smoothie on a Website
A quick preview on a landing page: the most colorful colors become the primary and accent, a light one the surface. For a more realistic look across many designs, open it in the Palette Visualizer below.
See it on real designs
This is a single preview. The Palette Visualizer shows the palette on 11 designs — dashboards, mobile apps, pricing and blog pages, posters and business cards — lets you change which color plays which role, switch to dark mode and check contrast.
Accessible Color Combinations
Pairs from this palette that work as text on a background, with their WCAG contrast ratio. AA needs 4.5:1 for body text; large text needs 3:1.
- Oxblood on Bubblegum#590d22 on #ffccd59.86:1AAA
- Oxblood on Flamingo#590d22 on #ff8fa36.44:1AA
- Brown on Bubblegum#a4133c on #ffccd55.42:1AA
- Oxblood on Watermelon#590d22 on #ff4d6d4.34:1AA Large
- Brown on Flamingo#a4133c on #ff8fa33.54:1AA Large