What are the hex codes in the Synth Strawberry & Tulip palette?

The Synth Strawberry & Tulip color palette consists of Obsidian #100113, Strawberry #F44F92, Tulip #FF8B8E, Mauve #FF9EDF.

How should I use the Synth Strawberry & Tulip palette on a website?

Use Mauve #FF9EDF as the background, Obsidian #100113 for text, Tulip #FF8B8E for buttons and links, and Strawberry #F44F92 for accents. 3 of 6 color pairs pass WCAG AA (4.5:1); the strongest is Obsidian on Mauve at 10.82:1.

Which colors in Synth Strawberry & Tulip have enough contrast for text?

The highest-contrast pair is #100113 on #FF9EDF with a ratio of 10.82:1, which passes WCAG AA for normal text.

#100113Obsidian

#F44F92Strawberry

#FF8B8ETulip

#FF9EDFMauve

Synth Strawberry & Tulip color palette

Cyberpunk Warm Black Pink

Color codes click any value to copy

Name	HEX	RGB	HSL	OKLCH
Obsidian	`#100113`	`rgb(16, 1, 19)`	`hsl(290, 90%, 4%)`	`oklch(12.8% 0.053 322)`
Strawberry	`#F44F92`	`rgb(244, 79, 146)`	`hsl(336, 88%, 63%)`	`oklch(67.3% 0.208 359)`
Tulip	`#FF8B8E`	`rgb(255, 139, 142)`	`hsl(358, 100%, 77%)`	`oklch(76.4% 0.141 19)`
Mauve	`#FF9EDF`	`rgb(255, 158, 223)`	`hsl(320, 100%, 81%)`	`oklch(81.7% 0.139 340)`

Why it works and how to use it

Synth Strawberry & Tulip is a vivid analogous color palette tagged cyberpunk, warm, black. Analogous neighbors on the wheel (Strawberry, Tulip, Mauve) 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 3 chromatic colors, Tulip takes the lead while the rest support. Lightness runs from 4% to 81%. Well suited to websites, presentations and branding.

Background: Mauve (#FF9EDF) is the lightest color, so it belongs on large surfaces.
Text: Obsidian (#100113) on #FF9EDF gives 10.82:1, passing WCAG AAA.
Primary: Tulip (#FF8B8E) is the most saturated mid-tone; use it for buttons and links with a border or a darker shade for contrast.
Accent: Strawberry (#F44F92) for highlights, badges and hover states.

3 of 6 color pairs pass WCAG AA (4.5:1); the strongest is Obsidian on Mauve at 10.82:1.

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

BrandFeaturesPricingBlogGet started

Design faster with Synth Strawberry & Tulip

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

#100113

#F44F92

#FF8B8E

#FF9EDF

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
`#100113` on `#FF9EDF`	Aa	10.82:1	AAA
`#100113` on `#FF8B8E`	Aa	9.01:1	AAA
`#100113` on `#F44F92`	Aa	6.16:1	AA
`#F44F92` on `#FF9EDF`	Aa	1.76:1	Fail
`#F44F92` on `#FF8B8E`	Aa	1.46:1	Fail
`#FF8B8E` on `#FF9EDF`	Aa	1.2:1	Fail

Similar palettes 24 more in this mood