← Back to Editor

#E1D6B6 · #DAC99D · #C6A86A · #CF493D · #F1170E

bright

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#E1D6B6

Goose Yellow · Wheat · Lemon Cream

HEX
#E1D6B6
RGB
rgb(225, 214, 182)
HSL
hsl(45, 42%, 80%)
HSB
hsb(45, 19%, 88%)
CMYK
cmyk(0%, 5%, 19%, 12%)
Oklch
oklch(87.7% 0.044 91.3)

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

#DAC99D

Goose Yellow · BurlyWood · Sunflower

HEX
#DAC99D
RGB
rgb(218, 201, 157)
HSL
hsl(43, 45%, 74%)
HSB
hsb(43, 28%, 85%)
CMYK
cmyk(0%, 8%, 28%, 15%)
Oklch
oklch(83.9% 0.061 89.4)

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

#C6A86A

Ginger · Tan · Sunflower

HEX
#C6A86A
RGB
rgb(198, 168, 106)
HSL
hsl(40, 45%, 60%)
HSB
hsb(40, 46%, 78%)
CMYK
cmyk(0%, 15%, 46%, 22%)
Oklch
oklch(74.4% 0.088 84.6)

Traditional「Ginger」· Paint「Sunflower」· Creative Blush Sunrise

#CF493D

Crimson · Chocolate · Passion Red

HEX
#CF493D
RGB
rgb(207, 73, 61)
HSL
hsl(5, 60%, 53%)
HSB
hsb(5, 71%, 81%)
CMYK
cmyk(0%, 65%, 71%, 19%)
Oklch
oklch(58.8% 0.172 28.5)

Traditional「Crimson」· Paint「Passion Red」· Creative Blush Sunrise

#F1170E

Vermilion · Red · Passion Red

HEX
#F1170E
RGB
rgb(241, 23, 14)
HSL
hsl(2, 89%, 50%)
HSB
hsb(2, 94%, 95%)
CMYK
cmyk(0%, 90%, 94%, 5%)
Oklch
oklch(60.7% 0.241 29.3)

Traditional「Vermilion」· Paint「Passion Red」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E1D6B6
B7C1E1

Analogous

E1C1B7
E1D6B6
D7E1B7

Triadic

E1D6B6
B7E1D7
D7B7E1

Split-Comp.

E1D6B6
B7D7E1
C1B7E1

Tetradic

E1D6B6
B7E1C1
B7C1E1
E1B7D7

Contrast Matrix WCAG 2.1 Contrast

E1D6B6
DAC99D
C6A86A
CF493D
F1170E
—
1.1
Fail
1.6
Fail
3.1
AA Large
3.0
Fail
1.1
Fail
—
1.4
Fail
2.7
Fail
2.6
Fail
1.6
Fail
1.4
Fail
—
2.0
Fail
1.9
Fail
3.1
AA Large
2.7
Fail
2.0
Fail
—
1.0
Fail
3.0
Fail
2.6
Fail
1.9
Fail
1.0
Fail
—
White BG
1.4Fail
1.6Fail
2.3Fail
4.5AA Large
4.3AA Large
Black BG
14.5AAA
12.8AAA
9.2AAA
4.7AA
4.9AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

DCDCBE
D3D2A8
B9B979
959440
939110

Deuteranopia

DDDEC0
D4D5AA
BBBD7D
9DA741
9FB011

Tritanopia

E0C4C5
D9B0B2
C58587
C84243
E61212

Achromatopsia

D6D6D6
C9C9C9
AAAAAA
707070
575757

Shades & Tints Shades & Tints

#E1D6B6

Dark
Light

#DAC99D

Dark
Light

#C6A86A

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e1d6b6;
  --color-2: #dac99d;
  --color-3: #c6a86a;
  --color-4: #cf493d;
  --color-5: #f1170e;
}

SCSS

$color-1: #e1d6b6;
$color-2: #dac99d;
$color-3: #c6a86a;
$color-4: #cf493d;
$color-5: #f1170e;

TAILWIND

colors: {
  'brand-1': '#e1d6b6',
  'brand-2': '#dac99d',
  'brand-3': '#c6a86a',
  'brand-4': '#cf493d',
  'brand-5': '#f1170e',
}

RGB Array

[225, 214, 182], [218, 201, 157], [198, 168, 106], [207, 73, 61], [241, 23, 14]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This bright-style palette of #E1D6B6, #DAC99D, #C6A86A, #CF493D, #F1170E is ideal for: corporate websites, product showcases, portfolios. 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: #e1d6b6; --color-2: #dac99d; --color-3: #c6a86a; --color-4: #cf493d; --color-5: #f1170e. 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. 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 bright-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