← Back to Editor

#F2E8C2 · #B89B46 · #3B342A · #800834 · #C23468

A 5-color palette palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#F2E8C2

Goose Yellow · Bisque · Lemon Cream

HEX
#F2E8C2
RGB
rgb(242, 232, 194)
HSL
hsl(48, 65%, 85%)
HSB
hsb(48, 20%, 95%)
CMYK
cmyk(0%, 4%, 20%, 5%)
Oklch
oklch(92.9% 0.051 95.0)

Traditional「Goose Yellow」· Paint「Lemon Cream」· Creative Lemon Fizz

#B89B46

Ochre · GoldenRod · Honey Gold

HEX
#B89B46
RGB
rgb(184, 155, 70)
HSL
hsl(45, 45%, 50%)
HSB
hsb(45, 62%, 72%)
CMYK
cmyk(0%, 16%, 62%, 28%)
Oklch
oklch(69.9% 0.110 90.5)

Traditional「Ochre」· Paint「Honey Gold」· Creative Blush Sunrise

#3B342A

Ochre · DarkSlateGray · Cinnamon

HEX
#3B342A
RGB
rgb(59, 52, 42)
HSL
hsl(35, 17%, 20%)
HSB
hsb(35, 29%, 23%)
CMYK
cmyk(0%, 12%, 29%, 77%)
Oklch
oklch(32.9% 0.020 76.7)

Traditional「Ochre」· Paint「Cinnamon」· Creative Blush Sunrise

#800834

Dark Violet · Brown · Camellia

HEX
#800834
RGB
rgb(128, 8, 52)
HSL
hsl(338, 88%, 27%)
HSB
hsb(338, 94%, 50%)
CMYK
cmyk(0%, 94%, 59%, 50%)
Oklch
oklch(38.8% 0.150 8.6)

Traditional「Dark Violet」· Paint「Camellia」· Creative Blush Sunrise

#C23468

Dark Violet · MediumVioletRed · Camellia

HEX
#C23468
RGB
rgb(194, 52, 104)
HSL
hsl(338, 58%, 48%)
HSB
hsb(338, 73%, 76%)
CMYK
cmyk(0%, 73%, 46%, 24%)
Oklch
oklch(55.4% 0.182 3.2)

Traditional「Dark Violet」· Paint「Camellia」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F2E8C2
C0CAF2

Analogous

F2CFC0
F2E8C2
E3F2C0

Triadic

F2E8C2
C0F2E8
E8C0F2

Split-Comp.

F2E8C2
C0E3F2
CFC0F2

Tetradic

F2E8C2
C0F2CF
C0CAF2
F2C0E3

Contrast Matrix WCAG 2.1 Contrast

F2E8C2
B89B46
3B342A
800834
C23468
—
2.2
Fail
10.0
AAA
8.5
AAA
4.3
AA Large
2.2
Fail
—
4.6
AA
3.9
AA Large
2.0
Fail
10.0
AAA
4.6
AA
—
1.2
Fail
2.3
Fail
8.5
AAA
3.9
AA Large
1.2
Fail
—
2.0
Fail
4.3
AA Large
2.0
Fail
2.3
Fail
2.0
Fail
—
White BG
1.2Fail
2.7Fail
12.3AAA
10.5AAA
5.3AA
Black BG
17.1AAA
7.8AAA
1.7Fail
2.0Fail
4.0AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

EEEECB
ABAB5B
38382C
4C4B29
85835B

Deuteranopia

EEEFCD
ADAF60
38392D
535C27
8D9758

Tritanopia

F1D2D4
B76B6E
3B2E2F
7A211F
BB514F

Achromatopsia

E7E7E7
9A9A9A
353535
313131
646464

Shades & Tints Shades & Tints

#F2E8C2

Dark
Light

#B89B46

Dark
Light

#3B342A

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f2e8c2;
  --color-2: #b89b46;
  --color-3: #3b342a;
  --color-4: #800834;
  --color-5: #c23468;
}

SCSS

$color-1: #f2e8c2;
$color-2: #b89b46;
$color-3: #3b342a;
$color-4: #800834;
$color-5: #c23468;

TAILWIND

colors: {
  'brand-1': '#f2e8c2',
  'brand-2': '#b89b46',
  'brand-3': '#3b342a',
  'brand-4': '#800834',
  'brand-5': '#c23468',
}

RGB Array

[242, 232, 194], [184, 155, 70], [59, 52, 42], [128, 8, 52], [194, 52, 104]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #F2E8C2, #B89B46, #3B342A, #800834, #C23468 is ideal for: infographics, data visualization, accessible design. High contrast ensures clear visual hierarchy and readability. It is a balanced and harmonious choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #f2e8c2; --color-2: #b89b46; --color-3: #3b342a; --color-4: #800834; --color-5: #c23468. LangColor editor supports one-click export to CSS, SCSS, Tailwind, JSON and more. Click the "Export" button to choose your format.

What UI/UX design tips apply to this palette?

Medium-brightness colors suit brand primary and accent colors. Use the darkest for text, lightest for backgrounds, and mid-tones for emphasis. High-contrast palettes naturally meet WCAG accessibility standards. Use the "Contrast Matrix" tool in LangColor editor to check WCAG accessibility levels for every color pair.

Which industries or brands suit this palette?

This general-style 5-color scheme is especially suited for tech, SaaS, healthcare, eco industries. Click "AI Analysis" in the editor for more detailed brand color suggestions.

🎨 Open this palette in Editor →

Generated by LangColor online color tool · Breaking the barrier between language and color