← Back to Editor

#200D09 · #664651 · #AB7992 · #CFBB88 · #EBDEBE

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

#200D09

Crimson · Black · Deep Berry

HEX
#200D09
RGB
rgb(32, 13, 9)
HSL
hsl(10, 56%, 8%)
HSB
hsb(10, 72%, 13%)
CMYK
cmyk(0%, 59%, 72%, 87%)
Oklch
oklch(18.7% 0.034 33.0)

TraditionalCrimson」· PaintDeep Berry」· Creative Blush Sunrise

#664651

Dark Violet · DimGray · Camellia

HEX
#664651
RGB
rgb(102, 70, 81)
HSL
hsl(339, 19%, 34%)
HSB
hsb(339, 31%, 40%)
CMYK
cmyk(0%, 31%, 21%, 60%)
Oklch
oklch(43.3% 0.047 356.9)

TraditionalDark Violet」· PaintCamellia」· Creative Blush Sunrise

#AB7992

Dark Violet · Gray · Rose Pink

HEX
#AB7992
RGB
rgb(171, 121, 146)
HSL
hsl(330, 23%, 57%)
HSB
hsb(330, 29%, 67%)
CMYK
cmyk(0%, 29%, 15%, 33%)
Oklch
oklch(63.4% 0.071 347.9)

TraditionalDark Violet」· PaintRose Pink」· Creative Blush Sunrise

#CFBB88

Ginger · Tan · Sunflower

HEX
#CFBB88
RGB
rgb(207, 187, 136)
HSL
hsl(43, 43%, 67%)
HSB
hsb(43, 34%, 81%)
CMYK
cmyk(0%, 10%, 34%, 19%)
Oklch
oklch(79.7% 0.071 89.1)

TraditionalGinger」· PaintSunflower」· Creative Lemon Fizz

#EBDEBE

Goose Yellow · Wheat · Lemon Cream

HEX
#EBDEBE
RGB
rgb(235, 222, 190)
HSL
hsl(43, 53%, 83%)
HSB
hsb(43, 19%, 92%)
CMYK
cmyk(0%, 6%, 19%, 8%)
Oklch
oklch(90.3% 0.045 88.5)

TraditionalGoose Yellow」· PaintLemon Cream」· Creative Lemon Fizz

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

200D09
091C20

Analogous

200911
200D09
201809

Triadic

200D09
09200D
0D0920

Split-Comp.

200D09
092018
091120

Tetradic

200D09
112009
091C20
180920

Contrast Matrix WCAG 2.1 Contrast

200D09
664651
AB7992
CFBB88
EBDEBE
2.3
Fail
5.2
AA
9.9
AAA
14.0
AAA
2.3
Fail
2.3
Fail
4.3
AA Large
6.1
AA
5.2
AA
2.3
Fail
1.9
Fail
2.7
Fail
9.9
AAA
4.3
AA Large
1.9
Fail
1.4
Fail
14.0
AAA
6.1
AA
2.7
Fail
1.4
Fail
White BG
18.7AAA
8.2AAA
3.6AA Large
1.9Fail
1.3Fail
Black BG
1.1Fail
2.6Fail
5.9AA
11.1AAA
15.7AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

18180A
58584E
95958C
C6C694
E5E5C6

Deuteranopia

191A0A
5A5C4E
989C8B
C8C997
E6E7C8

Tritanopia

1F0B0B
644C4C
A98786
CE9EA0
EACCCD

Achromatopsia

121212
515151
8B8B8B
BBBBBB
DEDEDE

Shades & Tints Shades & Tints

#200D09

Dark
Light

#664651

Dark
Light

#AB7992

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #200d09;
  --color-2: #664651;
  --color-3: #ab7992;
  --color-4: #cfbb88;
  --color-5: #ebdebe;
}

SCSS

$color-1: #200d09;
$color-2: #664651;
$color-3: #ab7992;
$color-4: #cfbb88;
$color-5: #ebdebe;

TAILWIND

colors: {
  'brand-1': '#200d09',
  'brand-2': '#664651',
  'brand-3': '#ab7992',
  'brand-4': '#cfbb88',
  'brand-5': '#ebdebe',
}

RGB Array

[32, 13, 9], [102, 70, 81], [171, 121, 146], [207, 187, 136], [235, 222, 190]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #200D09, #664651, #AB7992, #CFBB88, #EBDEBE 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: #200d09; --color-2: #664651; --color-3: #ab7992; --color-4: #cfbb88; --color-5: #ebdebe. 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