← Back to Editor

#E66D33 · #211717 · #D5CD93 · #A9DDDE · #F8EBD4

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#E66D33

Tangerine · Chocolate · Warm Sun

HEX
#E66D33
RGB
rgb(230, 109, 51)
HSL
hsl(19, 78%, 55%)
HSB
hsb(19, 78%, 90%)
CMYK
cmyk(0%, 53%, 78%, 10%)
Oklch
oklch(67.1% 0.166 43.8)

Traditional「Tangerine」· Paint「Warm Sun」· Creative Blush Sunrise

#211717

Crimson · Black · Deep Berry

HEX
#211717
RGB
rgb(33, 23, 23)
HSL
hsl(0, 18%, 11%)
HSB
hsb(0, 30%, 13%)
CMYK
cmyk(0%, 30%, 30%, 87%)
Oklch
oklch(21.7% 0.016 18.5)

Traditional「Crimson」· Paint「Deep Berry」· Creative Blush Sunrise

#D5CD93

Fresh Green · BurlyWood · Sunflower

HEX
#D5CD93
RGB
rgb(213, 205, 147)
HSL
hsl(53, 44%, 71%)
HSB
hsb(53, 31%, 84%)
CMYK
cmyk(0%, 4%, 31%, 16%)
Oklch
oklch(84.1% 0.076 101.2)

Traditional「Fresh Green」· Paint「Sunflower」· Creative Lemon Fizz

#A9DDDE

Sky Blue · LightBlue · Glacier Blue

HEX
#A9DDDE
RGB
rgb(169, 221, 222)
HSL
hsl(181, 45%, 77%)
HSB
hsb(181, 24%, 87%)
CMYK
cmyk(24%, 0%, 0%, 13%)
Oklch
oklch(86.2% 0.053 197.7)

Traditional「Sky Blue」· Paint「Glacier Blue」· Creative Arctic Pool

#F8EBD4

Goose Yellow · Beige · Peach Orange

HEX
#F8EBD4
RGB
rgb(248, 235, 212)
HSL
hsl(38, 72%, 90%)
HSB
hsb(38, 15%, 97%)
CMYK
cmyk(0%, 5%, 15%, 3%)
Oklch
oklch(94.4% 0.033 82.0)

Traditional「Goose Yellow」· Paint「Peach Orange」· Creative Honey Glow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E66D33
33ADE6

Analogous

E63354
E66D33
E6C533

Triadic

E66D33
33E66B
6B33E6

Split-Comp.

E66D33
33E6C5
3354E6

Tetradic

E66D33
54E633
33ADE6
C533E6

Contrast Matrix WCAG 2.1 Contrast

E66D33
211717
D5CD93
A9DDDE
F8EBD4
—
5.5
AA
2.0
Fail
2.1
Fail
2.7
Fail
5.5
AA
—
10.8
AAA
11.7
AAA
14.9
AAA
2.0
Fail
10.8
AAA
—
1.1
Fail
1.4
Fail
2.1
Fail
11.7
AAA
1.1
Fail
—
1.3
Fail
2.7
Fail
14.9
AAA
1.4
Fail
1.3
Fail
—
White BG
3.2AA Large
17.5AAA
1.6Fail
1.5Fail
1.2Fail
Black BG
6.6AA
1.2Fail
13.0AAA
14.1AAA
17.8AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

B2B141
1D1D17
D2D1A1
C0C0DE
F2F2DA

Deuteranopia

B9C244
1D1E17
D2D3A4
BDB9DE
F3F4DB

Tritanopia

E04C4F
211717
D5ACAF
ACDEDE
F7DEDF

Achromatopsia

8B8B8B
1A1A1A
C9C9C9
CECECE
ECECEC

Shades & Tints Shades & Tints

#E66D33

Dark
Light

#211717

Dark
Light

#D5CD93

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e66d33;
  --color-2: #211717;
  --color-3: #d5cd93;
  --color-4: #a9ddde;
  --color-5: #f8ebd4;
}

SCSS

$color-1: #e66d33;
$color-2: #211717;
$color-3: #d5cd93;
$color-4: #a9ddde;
$color-5: #f8ebd4;

TAILWIND

colors: {
  'brand-1': '#e66d33',
  'brand-2': '#211717',
  'brand-3': '#d5cd93',
  'brand-4': '#a9ddde',
  'brand-5': '#f8ebd4',
}

RGB Array

[230, 109, 51], [33, 23, 23], [213, 205, 147], [169, 221, 222], [248, 235, 212]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #E66D33, #211717, #D5CD93, #A9DDDE, #F8EBD4 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: #e66d33; --color-2: #211717; --color-3: #d5cd93; --color-4: #a9ddde; --color-5: #f8ebd4. 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