← Back to Editor

#161A20 · #60553D · #BF7C30 · #ACBB8C · #DDEFC0

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

#161A20

Indigo · Black · Deep Sea Blue

HEX
#161A20
RGB
rgb(22, 26, 32)
HSL
hsl(216, 19%, 11%)
HSB
hsb(216, 31%, 13%)
CMYK
cmyk(31%, 19%, 0%, 87%)
Oklch
oklch(21.6% 0.013 258.4)

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

#60553D

Ochre · DarkOliveGreen · Honey Gold

HEX
#60553D
RGB
rgb(96, 85, 61)
HSL
hsl(41, 22%, 31%)
HSB
hsb(41, 36%, 38%)
CMYK
cmyk(0%, 11%, 36%, 62%)
Oklch
oklch(45.4% 0.039 86.1)

Traditional「Ochre」· Paint「Honey Gold」· Creative Blush Sunrise

#BF7C30

Ochre · Chocolate · Amber Brown

HEX
#BF7C30
RGB
rgb(191, 124, 48)
HSL
hsl(32, 60%, 47%)
HSB
hsb(32, 75%, 75%)
CMYK
cmyk(0%, 35%, 75%, 25%)
Oklch
oklch(64.3% 0.122 65.4)

Traditional「Ochre」· Paint「Amber Brown」· Creative Blush Sunrise

#ACBB8C

Willow Green · DarkSeaGreen · Apple Green

HEX
#ACBB8C
RGB
rgb(172, 187, 140)
HSL
hsl(79, 26%, 64%)
HSB
hsb(79, 25%, 73%)
CMYK
cmyk(8%, 0%, 25%, 27%)
Oklch
oklch(76.8% 0.066 122.3)

Traditional「Willow Green」· Paint「Apple Green」· Creative Mint Breeze

#DDEFC0

Willow Green · Wheat · Mint Green

HEX
#DDEFC0
RGB
rgb(221, 239, 192)
HSL
hsl(83, 59%, 85%)
HSB
hsb(83, 20%, 94%)
CMYK
cmyk(8%, 0%, 20%, 6%)
Oklch
oklch(92.7% 0.065 124.7)

Traditional「Willow Green」· Paint「Mint Green」· Creative Mint Breeze

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

161A20
211D17

Analogous

172021
161A20
181721

Triadic

161A20
21171B
1B2117

Split-Comp.

161A20
211817
202117

Tetradic

161A20
211720
211D17
172118

Contrast Matrix WCAG 2.1 Contrast

161A20
60553D
BF7C30
ACBB8C
DDEFC0
—
2.4
Fail
5.1
AA
8.5
AAA
14.3
AAA
2.4
Fail
—
2.1
Fail
3.6
AA Large
6.0
AA
5.1
AA
2.1
Fail
—
1.7
Fail
2.8
Fail
8.5
AAA
3.6
AA Large
1.7
Fail
—
1.7
Fail
14.3
AAA
6.0
AA
2.8
Fail
1.7
Fail
—
White BG
17.5AAA
7.3AAA
3.4AA Large
2.1Fail
1.2Fail
Black BG
1.2Fail
2.9Fail
6.1AA
10.2AAA
17.2AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

18181F
5B5B43
A2A142
B2B397
E5E5CB

Deuteranopia

18171E
5C5D44
A6AB47
B2B19A
E4E2CE

Tritanopia

161D1D
5F4748
BC5154
ADA0A2
DED4D6

Achromatopsia

191919
565656
878787
B1B1B1
E4E4E4

Shades & Tints Shades & Tints

#161A20

Dark
Light

#60553D

Dark
Light

#BF7C30

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #161a20;
  --color-2: #60553d;
  --color-3: #bf7c30;
  --color-4: #acbb8c;
  --color-5: #ddefc0;
}

SCSS

$color-1: #161a20;
$color-2: #60553d;
$color-3: #bf7c30;
$color-4: #acbb8c;
$color-5: #ddefc0;

TAILWIND

colors: {
  'brand-1': '#161a20',
  'brand-2': '#60553d',
  'brand-3': '#bf7c30',
  'brand-4': '#acbb8c',
  'brand-5': '#ddefc0',
}

RGB Array

[22, 26, 32], [96, 85, 61], [191, 124, 48], [172, 187, 140], [221, 239, 192]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #161A20, #60553D, #BF7C30, #ACBB8C, #DDEFC0 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: #161a20; --color-2: #60553d; --color-3: #bf7c30; --color-4: #acbb8c; --color-5: #ddefc0. 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