What are the hex codes in the Berry Splash palette?

The Berry Splash color palette consists of Magenta #D62598, Grape #7B2CBF, Amber #FFC300, White #FFFFFF.

How should I use the Berry Splash palette on a website?

Use White #FFFFFF as the background, Grape #7B2CBF for text, Amber #FFC300 for buttons and links, and Magenta #D62598 for accents. 2 of 6 color pairs pass WCAG AA (4.5:1); the strongest is Grape on White at 7.11:1.

Which colors in Berry Splash have enough contrast for text?

The highest-contrast pair is #7B2CBF on #FFFFFF with a ratio of 7.11:1, which passes WCAG AA for normal text.

#D62598Magenta

#7B2CBFGrape

#FFC300Amber

#FFFFFFWhite

Berry Splash color palette

Vibrant Neon Purple Yellow White

Color codes click any value to copy

Name	HEX	RGB	HSL	OKLCH
Magenta	`#D62598`	`rgb(214, 37, 152)`	`hsl(321, 71%, 49%)`	`oklch(59.4% 0.230 347)`
Grape	`#7B2CBF`	`rgb(123, 44, 191)`	`hsl(272, 63%, 46%)`	`oklch(48.7% 0.213 304)`
Amber	`#FFC300`	`rgb(255, 195, 0)`	`hsl(46, 100%, 50%)`	`oklch(84.8% 0.174 86)`
White	`#FFFFFF`	`rgb(255, 255, 255)`	`hsl(0, 0%, 100%)`	`oklch(100.0% 0.000 0)`

Why it works and how to use it

Berry Splash is a complementary color palette tagged vibrant, neon, purple. Magenta and Amber sit nearly opposite on the color wheel, so the pairing has real energy; keep one as the accent. Neither washed out nor loud, it adapts to most contexts. Warm and cool hues are mixed, which adds depth.

With 3 chromatic colors, Amber takes the lead while the rest support. Lightness runs from 46% to 100%. Well suited to websites, presentations and branding.

Background: White (#FFFFFF) is the lightest color, so it belongs on large surfaces.
Text: Grape (#7B2CBF) on #FFFFFF gives 7.11:1, passing WCAG AAA.
Primary: Amber (#FFC300) is the most saturated mid-tone; use it for buttons and links with a border or a darker shade for contrast.
Accent: Magenta (#D62598) for highlights, badges and hover states.

2 of 6 color pairs pass WCAG AA (4.5:1); the strongest is Grape on White at 7.11:1.

Preview on a real UI see how the palette feels in context

BrandFeaturesPricingBlogGet started

Design faster with Berry Splash

A palette preview that turns four colors into a page, so you can judge hierarchy, contrast and mood before you commit.

Primary action Secondary

Card title

Roles are assigned by lightness.

Color blindness simulation

#D62598

#7B2CBF

#FFC300

#FFFFFF

Color-blind check: all four colors stay distinguishable under protanopia, deuteranopia and tritanopia.

Palette card

Contrast check WCAG ratios between palette colors

Pair	Sample	Ratio	Level
`#7B2CBF` on `#FFFFFF`	Aa	7.11:1	AAA
`#D62598` on `#FFFFFF`	Aa	4.59:1	AA
`#7B2CBF` on `#FFC300`	Aa	4.42:1	AA large only
`#D62598` on `#FFC300`	Aa	2.85:1	Fail
`#FFC300` on `#FFFFFF`	Aa	1.61:1	Fail
`#D62598` on `#7B2CBF`	Aa	1.55:1	Fail

Similar palettes 24 more in this mood