← Back to Editor

#ADBE93 · #658471 · #4D4B4B · #382C2A · #070F0A

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

ProfoundPremiumWarm

Industry INDUSTRY

FinanceLuxury

UI Context UI CONTEXT

Dark ThemeCorporateData Visualization

Color Details Color Details

#ADBE93

Willow Green · DarkSeaGreen · Apple Green

HEX
#ADBE93
RGB
rgb(173, 190, 147)
HSL
hsl(84, 25%, 66%)
HSB
hsb(84, 23%, 75%)
CMYK
cmyk(9%, 0%, 23%, 25%)
Oklch
oklch(77.7% 0.062 125.3)

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

#658471

Celadon · DimGray · Olive Green

HEX
#658471
RGB
rgb(101, 132, 113)
HSL
hsl(143, 13%, 46%)
HSB
hsb(143, 23%, 52%)
CMYK
cmyk(23%, 0%, 14%, 48%)
Oklch
oklch(58.4% 0.046 157.7)

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

#4D4B4B

Dark Cyan · DarkSlateGray · Charcoal

HEX
#4D4B4B
RGB
rgb(77, 75, 75)
HSL
hsl(0, 1%, 30%)
HSB
hsb(0, 3%, 30%)
CMYK
cmyk(0%, 3%, 3%, 70%)
Oklch
oklch(41.5% 0.003 17.3)

Traditional「Dark Cyan」· Paint「Charcoal」· Creative Midnight Shadow

#382C2A

Crimson · DarkSlateGray · Deep Berry

HEX
#382C2A
RGB
rgb(56, 44, 42)
HSL
hsl(9, 14%, 19%)
HSB
hsb(9, 25%, 22%)
CMYK
cmyk(0%, 21%, 25%, 78%)
Oklch
oklch(30.6% 0.018 29.2)

Traditional「Crimson」· Paint「Deep Berry」· Creative Blush Sunrise

#070F0A

Celadon · Black · Dark Green

HEX
#070F0A
RGB
rgb(7, 15, 10)
HSL
hsl(143, 36%, 4%)
HSB
hsb(143, 53%, 6%)
CMYK
cmyk(53%, 0%, 33%, 94%)
Oklch
oklch(15.8% 0.017 157.5)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

ADBE93
A493BE

Analogous

BEBA93
ADBE93
97BE93

Triadic

ADBE93
93ADBE
BE93AD

Split-Comp.

ADBE93
9397BE
BA93BE

Tetradic

ADBE93
93BEBA
A493BE
BE9397

Contrast Matrix WCAG 2.1 Contrast

ADBE93
658471
4D4B4B
382C2A
070F0A
—
2.1
Fail
4.4
AA Large
6.8
AA
9.8
AAA
2.1
Fail
—
2.1
Fail
3.3
AA Large
4.7
AA
4.4
AA Large
2.1
Fail
—
1.6
Fail
2.2
Fail
6.8
AA
3.3
AA Large
1.6
Fail
—
1.4
Fail
9.8
AAA
4.7
AA
2.2
Fail
1.4
Fail
—
White BG
2.0Fail
4.1AA Large
8.7AAA
13.4AAA
19.4AAA
Black BG
10.6AAA
5.1AA
2.4Fail
1.6Fail
1.1Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

B4B59D
727376
4C4C4B
33332A
0A0B0B

Deuteranopia

B3B2A0
716E77
4C4C4B
34342B
0A090C

Tritanopia

AEA6A7
67797A
4D4B4B
372B2B
070C0C

Achromatopsia

B4B4B4
797979
4C4C4C
2F2F2F
0C0C0C

Shades & Tints Shades & Tints

#ADBE93

Dark
Light

#658471

Dark
Light

#4D4B4B

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #adbe93;
  --color-2: #658471;
  --color-3: #4d4b4b;
  --color-4: #382c2a;
  --color-5: #070f0a;
}

SCSS

$color-1: #adbe93;
$color-2: #658471;
$color-3: #4d4b4b;
$color-4: #382c2a;
$color-5: #070f0a;

TAILWIND

colors: {
  'brand-1': '#adbe93',
  'brand-2': '#658471',
  'brand-3': '#4d4b4b',
  'brand-4': '#382c2a',
  'brand-5': '#070f0a',
}

RGB Array

[173, 190, 147], [101, 132, 113], [77, 75, 75], [56, 44, 42], [7, 15, 10]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #ADBE93, #658471, #4D4B4B, #382C2A, #070F0A is ideal for: brand design, premium product pages, magazine layouts, tech websites, dark mode UIs, game UIs, infographics, data visualization, accessible design. Low-saturation colors convey a sophisticated, premium feel. High contrast ensures clear visual hierarchy and readability. It is a classic and elegant choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #adbe93; --color-2: #658471; --color-3: #4d4b4b; --color-4: #382c2a; --color-5: #070f0a. 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 finance, legal, luxury industries. Restrained colors convey professionalism and trust. 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