← Back to Editor

#DEE326 · #B3B120 · #4C5F49 · #373423 · #BADDD7

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

#DEE326

Autumn Sage · Gold · Sunflower

HEX
#DEE326
RGB
rgb(222, 227, 38)
HSL
hsl(62, 77%, 52%)
HSB
hsb(62, 83%, 89%)
CMYK
cmyk(2%, 0%, 83%, 11%)
Oklch
oklch(88.3% 0.187 111.3)

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

#B3B120

Autumn Sage · GoldenRod · Honey Gold

HEX
#B3B120
RGB
rgb(179, 177, 32)
HSL
hsl(59, 70%, 41%)
HSB
hsb(59, 82%, 70%)
CMYK
cmyk(0%, 1%, 82%, 30%)
Oklch
oklch(73.9% 0.152 108.8)

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

#4C5F49

Celadon · DarkOliveGreen · Forest Green

HEX
#4C5F49
RGB
rgb(76, 95, 73)
HSL
hsl(112, 13%, 33%)
HSB
hsb(112, 23%, 37%)
CMYK
cmyk(20%, 0%, 23%, 63%)
Oklch
oklch(46.3% 0.042 141.3)

Traditional「Celadon」· Paint「Forest Green」· Creative Blush Sunrise

#373423

Autumn Sage · DarkSlateGray · Amber Gold

HEX
#373423
RGB
rgb(55, 52, 35)
HSL
hsl(51, 22%, 18%)
HSB
hsb(51, 36%, 22%)
CMYK
cmyk(0%, 5%, 36%, 78%)
Oklch
oklch(32.3% 0.029 99.3)

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

#BADDD7

Jade · LightBlue · Glacier Blue

HEX
#BADDD7
RGB
rgb(186, 221, 215)
HSL
hsl(170, 34%, 80%)
HSB
hsb(170, 16%, 87%)
CMYK
cmyk(16%, 0%, 3%, 13%)
Oklch
oklch(87.1% 0.038 183.9)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

DEE326
2D26E3

Analogous

E38B26
DEE326
7EE326

Triadic

DEE326
26DDE3
E326DD

Split-Comp.

DEE326
267EE3
8B26E3

Tetradic

DEE326
26E38B
2D26E3
E3267E

Contrast Matrix WCAG 2.1 Contrast

DEE326
B3B120
4C5F49
373423
BADDD7
—
1.6
Fail
5.0
AA
9.0
AAA
1.0
Fail
1.6
Fail
—
3.0
AA Large
5.5
AA
1.6
Fail
5.0
AA
3.0
AA Large
—
1.8
Fail
4.7
AA
9.0
AAA
5.5
AA
1.8
Fail
—
8.6
AAA
1.0
Fail
1.6
Fail
4.7
AA
8.6
AAA
—
White BG
1.4Fail
2.3Fail
6.9AA
12.5AAA
1.5Fail
Black BG
15.1AAA
9.2AAA
3.0AA Large
1.7Fail
14.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

E0E054
B2B243
54544E
363627
C9C9D8

Deuteranopia

E0DF5F
B2B24C
535250
363628
C7C5D9

Tritanopia

DE7880
B35F65
4D5353
372A2B
BCDADA

Achromatopsia

CCCCCC
A1A1A1
575757
333333
D2D2D2

Shades & Tints Shades & Tints

#DEE326

Dark
Light

#B3B120

Dark
Light

#4C5F49

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #dee326;
  --color-2: #b3b120;
  --color-3: #4c5f49;
  --color-4: #373423;
  --color-5: #baddd7;
}

SCSS

$color-1: #dee326;
$color-2: #b3b120;
$color-3: #4c5f49;
$color-4: #373423;
$color-5: #baddd7;

TAILWIND

colors: {
  'brand-1': '#dee326',
  'brand-2': '#b3b120',
  'brand-3': '#4c5f49',
  'brand-4': '#373423',
  'brand-5': '#baddd7',
}

RGB Array

[222, 227, 38], [179, 177, 32], [76, 95, 73], [55, 52, 35], [186, 221, 215]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #DEE326, #B3B120, #4C5F49, #373423, #BADDD7 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: #dee326; --color-2: #b3b120; --color-3: #4c5f49; --color-4: #373423; --color-5: #baddd7. 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