← Back to Editor

#FFF6B1 · #DDD489 · #979F76 · #849571 · #132B43

dark

A 5-color dark 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

#FFF6B1

Fresh Green · Wheat · Lemon Cream

HEX
#FFF6B1
RGB
rgb(255, 246, 177)
HSL
hsl(53, 100%, 85%)
HSB
hsb(53, 31%, 100%)
CMYK
cmyk(0%, 4%, 31%, 0%)
Oklch
oklch(96.4% 0.088 101.6)

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

#DDD489

Fresh Green · Khaki · Sunflower

HEX
#DDD489
RGB
rgb(221, 212, 137)
HSL
hsl(54, 55%, 70%)
HSB
hsb(54, 38%, 87%)
CMYK
cmyk(0%, 4%, 38%, 13%)
Oklch
oklch(86.0% 0.096 102.3)

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

#979F76

Grass Green · DarkSeaGreen · Olive Green

HEX
#979F76
RGB
rgb(151, 159, 118)
HSL
hsl(72, 18%, 54%)
HSB
hsb(72, 26%, 62%)
CMYK
cmyk(5%, 0%, 26%, 38%)
Oklch
oklch(68.5% 0.058 116.9)

Traditional「Grass Green」· Paint「Olive Green」· Creative Blush Sunrise

#849571

Grass Green · Gray · Olive Green

HEX
#849571
RGB
rgb(132, 149, 113)
HSL
hsl(88, 15%, 51%)
HSB
hsb(88, 24%, 58%)
CMYK
cmyk(11%, 0%, 24%, 42%)
Oklch
oklch(64.6% 0.055 128.4)

Traditional「Grass Green」· Paint「Olive Green」· Creative Blush Sunrise

#132B43

Indigo · DarkSlateGray · Deep Sea Blue

HEX
#132B43
RGB
rgb(19, 43, 67)
HSL
hsl(210, 56%, 17%)
HSB
hsb(210, 72%, 26%)
CMYK
cmyk(72%, 36%, 0%, 74%)
Oklch
oklch(28.3% 0.054 250.3)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FFF6B1
B3BBFF

Analogous

FFD0B3
FFF6B1
E2FFB3

Triadic

FFF6B1
B3FFF6
F6B3FF

Split-Comp.

FFF6B1
B3E2FF
D0B3FF

Tetradic

FFF6B1
B3FFD0
B3BBFF
FFB3E2

Contrast Matrix WCAG 2.1 Contrast

FFF6B1
DDD489
979F76
849571
132B43
—
1.4
Fail
2.5
Fail
2.9
Fail
13.1
AAA
1.4
Fail
—
1.8
Fail
2.1
Fail
9.5
AAA
2.5
Fail
1.8
Fail
—
1.2
Fail
5.2
AA
2.9
Fail
2.1
Fail
1.2
Fail
—
4.5
AA Large
13.1
AAA
9.5
AAA
5.2
AA
4.5
AA Large
—
White BG
1.1Fail
1.5Fail
2.8Fail
3.2AA Large
14.4AAA
Black BG
19.1AAA
13.9AAA
7.5AAA
6.5AA
1.5Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

FBFBC2
D9D99B
9A9B80
8B8C7A
1D1E3D

Deuteranopia

FCFCC6
DADAA0
9A9982
8A897C
1C1A3C

Tritanopia

FFCFD2
DDA9AD
978889
858182
143938

Achromatopsia

F1F1F1
CECECE
989898
8C8C8C
272727

Shades & Tints Shades & Tints

#FFF6B1

Dark
Light

#DDD489

Dark
Light

#979F76

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #fff6b1;
  --color-2: #ddd489;
  --color-3: #979f76;
  --color-4: #849571;
  --color-5: #132b43;
}

SCSS

$color-1: #fff6b1;
$color-2: #ddd489;
$color-3: #979f76;
$color-4: #849571;
$color-5: #132b43;

TAILWIND

colors: {
  'brand-1': '#fff6b1',
  'brand-2': '#ddd489',
  'brand-3': '#979f76',
  'brand-4': '#849571',
  'brand-5': '#132b43',
}

RGB Array

[255, 246, 177], [221, 212, 137], [151, 159, 118], [132, 149, 113], [19, 43, 67]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This dark-style palette of #FFF6B1, #DDD489, #979F76, #849571, #132B43 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: #fff6b1; --color-2: #ddd489; --color-3: #979f76; --color-4: #849571; --color-5: #132b43. 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 dark-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