What are the hex codes in the Studio Wisteria & Oat palette?

The Studio Wisteria & Oat color palette consists of Smoke #FBF7EF, Oat #EAD9B8, Wisteria #B3A1E5, Jet #3A3226.

How should I use the Studio Wisteria & Oat palette on a website?

Use Smoke #FBF7EF as the background, Jet #3A3226 for text, Wisteria #B3A1E5 for buttons and links, and Oat #EAD9B8 for accents. 3 of 6 color pairs pass WCAG AA (4.5:1); the strongest is Smoke on Jet at 11.81:1.

Which colors in Studio Wisteria & Oat have enough contrast for text?

The highest-contrast pair is #FBF7EF on #3A3226 with a ratio of 11.81:1, which passes WCAG AA for normal text.

#FBF7EFSmoke

#EAD9B8Oat

#B3A1E5Wisteria

#3A3226Jet

Studio Wisteria & Oat color palette

Muted Minimal White Beige Purple Gray

Color codes click any value to copy

Name	HEX	RGB	HSL	OKLCH
Smoke	`#FBF7EF`	`rgb(251, 247, 239)`	`hsl(40, 60%, 96%)`	`oklch(97.7% 0.011 85)`
Oat	`#EAD9B8`	`rgb(234, 217, 184)`	`hsl(40, 54%, 82%)`	`oklch(89.1% 0.048 84)`
Wisteria	`#B3A1E5`	`rgb(179, 161, 229)`	`hsl(256, 57%, 76%)`	`oklch(74.9% 0.098 296)`
Jet	`#3A3226`	`rgb(58, 50, 38)`	`hsl(36, 21%, 19%)`	`oklch(32.2% 0.023 78)`

Why it works and how to use it

Studio Wisteria & Oat is a complementary color palette tagged muted, minimal, white. Oat and Jet 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, Wisteria takes the lead while the rest support. Lightness runs from 19% to 96%. Well suited to websites, presentations and branding.

Background: Smoke (#FBF7EF) is the lightest color, so it belongs on large surfaces.
Text: Jet (#3A3226) on #FBF7EF gives 11.81:1, passing WCAG AAA.
Primary: Wisteria (#B3A1E5) is the most saturated mid-tone; use it for buttons and links with a border or a darker shade for contrast.
Accent: Oat (#EAD9B8) for highlights, badges and hover states.

3 of 6 color pairs pass WCAG AA (4.5:1); the strongest is Smoke on Jet at 11.81:1.

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

BrandFeaturesPricingBlogGet started

Design faster with Studio Wisteria & Oat

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

#FBF7EF

#EAD9B8

#B3A1E5

#3A3226

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
`#FBF7EF` on `#3A3226`	Aa	11.81:1	AAA
`#EAD9B8` on `#3A3226`	Aa	9.08:1	AAA
`#B3A1E5` on `#3A3226`	Aa	5.5:1	AA
`#FBF7EF` on `#B3A1E5`	Aa	2.15:1	Fail
`#EAD9B8` on `#B3A1E5`	Aa	1.65:1	Fail
`#FBF7EF` on `#EAD9B8`	Aa	1.3:1	Fail

Similar palettes 24 more in this mood