What are the hex codes in the Brick & Watermelon Tale palette?

The Brick & Watermelon Tale color palette consists of Brick #C23B51, Watermelon #E07585, Apricot #FFC49D, Beige #F4F1DE.

How should I use the Brick & Watermelon Tale palette on a website?

Use Beige #F4F1DE as the background, Brick #C23B51 for text, Apricot #FFC49D for buttons and links, and Watermelon #E07585 for accents. 1 of 6 color pairs pass WCAG AA (4.5:1); the strongest is Brick on Beige at 4.58:1.

Which colors in Brick & Watermelon Tale have enough contrast for text?

The highest-contrast pair is #C23B51 on #F4F1DE with a ratio of 4.58:1, which passes WCAG AA for normal text.

#C23B51Brick

#E07585Watermelon

#FFC49DApricot

#F4F1DEBeige

Brick & Watermelon Tale color palette

Warm Red White

Color codes click any value to copy

Name	HEX	RGB	HSL	OKLCH
Brick	`#C23B51`	`rgb(194, 59, 81)`	`hsl(350, 53%, 50%)`	`oklch(55.5% 0.171 15)`
Watermelon	`#E07585`	`rgb(224, 117, 133)`	`hsl(351, 63%, 67%)`	`oklch(68.8% 0.133 12)`
Apricot	`#FFC49D`	`rgb(255, 196, 157)`	`hsl(24, 100%, 81%)`	`oklch(86.4% 0.085 55)`
Beige	`#F4F1DE`	`rgb(244, 241, 222)`	`hsl(52, 50%, 91%)`	`oklch(95.5% 0.025 100)`

Why it works and how to use it

Brick & Watermelon Tale is a vivid light, analogous color palette tagged warm, red, white. Analogous neighbors on the wheel (Brick, Watermelon, Apricot) give it a natural, low-tension flow. Saturation runs high, so use the brightest color sparingly and let the others carry the surface area. The overall temperature is warm.

With 4 chromatic colors, Apricot takes the lead while the rest support. Lightness runs from 50% to 91%. Well suited to websites, presentations and branding.

Background: Beige (#F4F1DE) is the lightest color, so it belongs on large surfaces.
Text: Brick (#C23B51) on #F4F1DE gives 4.58:1, passing WCAG AA.
Primary: Apricot (#FFC49D) is the most saturated mid-tone; use it for buttons and links with a border or a darker shade for contrast.
Accent: Watermelon (#E07585) for highlights, badges and hover states.

1 of 6 color pairs pass WCAG AA (4.5:1); the strongest is Brick on Beige at 4.58:1.

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

BrandFeaturesPricingBlogGet started

Design faster with Brick & Watermelon Tale

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

#C23B51

#E07585

#FFC49D

#F4F1DE

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
`#C23B51` on `#F4F1DE`	Aa	4.58:1	AA
`#C23B51` on `#FFC49D`	Aa	3.38:1	AA large only
`#E07585` on `#F4F1DE`	Aa	2.62:1	Fail
`#E07585` on `#FFC49D`	Aa	1.93:1	Fail
`#C23B51` on `#E07585`	Aa	1.75:1	Fail
`#FFC49D` on `#F4F1DE`	Aa	1.36:1	Fail

Similar palettes 24 more in this mood