← Back to Editor

#CDDD54 · #8D964C · #352E38 · #2B1547 · #160F3A

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#CDDD54

Autumn Sage · GreenYellow · Sunflower

HEX
#CDDD54
RGB
rgb(205, 221, 84)
HSL
hsl(67, 67%, 60%)
HSB
hsb(67, 62%, 87%)
CMYK
cmyk(7%, 0%, 62%, 13%)
Oklch
oklch(86.0% 0.160 115.5)

Traditional「Autumn Sage」· Paint「Sunflower」· Creative Blush Sunrise

#8D964C

Autumn Sage · Gray · Honey Gold

HEX
#8D964C
RGB
rgb(141, 150, 76)
HSL
hsl(67, 33%, 44%)
HSB
hsb(67, 49%, 59%)
CMYK
cmyk(6%, 0%, 49%, 41%)
Oklch
oklch(64.9% 0.099 114.9)

Traditional「Autumn Sage」· Paint「Honey Gold」· Creative Blush Sunrise

#352E38

Dark Plum · DarkSlateGray · Dark Purple

HEX
#352E38
RGB
rgb(53, 46, 56)
HSL
hsl(282, 10%, 20%)
HSB
hsb(282, 18%, 22%)
CMYK
cmyk(5%, 18%, 0%, 78%)
Oklch
oklch(31.3% 0.020 315.8)

Traditional「Dark Plum」· Paint「Dark Purple」· Creative Blush Sunrise

#2B1547

Deep Indigo · MidnightBlue · Dark Purple

HEX
#2B1547
RGB
rgb(43, 21, 71)
HSL
hsl(266, 54%, 18%)
HSB
hsb(266, 70%, 28%)
CMYK
cmyk(39%, 70%, 0%, 72%)
Oklch
oklch(25.7% 0.090 300.4)

Traditional「Deep Indigo」· Paint「Dark Purple」· Creative Blush Sunrise

#160F3A

Deep Indigo · MidnightBlue · Deep Sea Blue

HEX
#160F3A
RGB
rgb(22, 15, 58)
HSL
hsl(250, 59%, 14%)
HSB
hsb(250, 74%, 23%)
CMYK
cmyk(62%, 74%, 0%, 77%)
Oklch
oklch(20.9% 0.079 284.7)

Traditional「Deep Indigo」· Paint「Deep Sea Blue」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

CDDD54
6555DD

Analogous

DDA955
CDDD54
89DD55

Triadic

CDDD54
55CDDD
DD55CD

Split-Comp.

CDDD54
5589DD
A955DD

Tetradic

CDDD54
55DDA9
6555DD
DD5589

Contrast Matrix WCAG 2.1 Contrast

CDDD54
8D964C
352E38
2B1547
160F3A
—
2.1
Fail
8.8
AAA
10.8
AAA
12.1
AAA
2.1
Fail
—
4.1
AA Large
5.1
AA
5.7
AA
8.8
AAA
4.1
AA Large
—
1.2
Fail
1.4
Fail
10.8
AAA
5.1
AA
1.2
Fail
—
1.1
Fail
12.1
AAA
5.7
AA
1.4
Fail
1.1
Fail
—
White BG
1.5Fail
3.2AA Large
13.1AAA
16.1AAA
18.0AAA
Black BG
14.1AAA
6.6AA
1.6Fail
1.3Fail
1.2Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

D4D475
91915E
323236
21213B
131330

Deuteranopia

D3D27D
909062
323335
232438
13142D

Tritanopia

CE8F95
8D6C6F
353433
2A312F
162726

Achromatopsia

C9C9C9
8B8B8B
313131
212121
161616

Shades & Tints Shades & Tints

#CDDD54

Dark
Light

#8D964C

Dark
Light

#352E38

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #cddd54;
  --color-2: #8d964c;
  --color-3: #352e38;
  --color-4: #2b1547;
  --color-5: #160f3a;
}

SCSS

$color-1: #cddd54;
$color-2: #8d964c;
$color-3: #352e38;
$color-4: #2b1547;
$color-5: #160f3a;

TAILWIND

colors: {
  'brand-1': '#cddd54',
  'brand-2': '#8d964c',
  'brand-3': '#352e38',
  'brand-4': '#2b1547',
  'brand-5': '#160f3a',
}

RGB Array

[205, 221, 84], [141, 150, 76], [53, 46, 56], [43, 21, 71], [22, 15, 58]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #CDDD54, #8D964C, #352E38, #2B1547, #160F3A is ideal for: tech websites, dark mode UIs, game UIs, 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: #cddd54; --color-2: #8d964c; --color-3: #352e38; --color-4: #2b1547; --color-5: #160f3a. 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?

Dark tones work well as backgrounds; pair with light text for readability. Use the brightest color for CTA buttons and interactive elements. 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