← Back to Editor

#0F0F07 · #6A7C66 · #DC564A · #D2BA8E · #B98345

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#0F0F07

Autumn Sage · Black · Amber Gold

HEX
#0F0F07
RGB
rgb(15, 15, 7)
HSL
hsl(60, 36%, 4%)
HSB
hsb(60, 53%, 6%)
CMYK
cmyk(0%, 0%, 53%, 94%)
Oklch
oklch(16.5% 0.016 108.1)

TraditionalAutumn Sage」· PaintAmber Gold」· Creative Blush Sunrise

#6A7C66

Celadon · DimGray · Olive Green

HEX
#6A7C66
RGB
rgb(106, 124, 102)
HSL
hsl(109, 10%, 44%)
HSB
hsb(109, 18%, 49%)
CMYK
cmyk(15%, 0%, 18%, 51%)
Oklch
oklch(56.5% 0.039 140.0)

TraditionalCeladon」· PaintOlive Green」· Creative Blush Sunrise

#DC564A

Vermilion · Tomato · Passion Red

HEX
#DC564A
RGB
rgb(220, 86, 74)
HSL
hsl(5, 68%, 58%)
HSB
hsb(5, 66%, 86%)
CMYK
cmyk(0%, 61%, 66%, 14%)
Oklch
oklch(62.7% 0.170 28.1)

TraditionalVermilion」· PaintPassion Red」· Creative Blush Sunrise

#D2BA8E

Ginger · Tan · Warm Sun

HEX
#D2BA8E
RGB
rgb(210, 186, 142)
HSL
hsl(39, 43%, 69%)
HSB
hsb(39, 32%, 82%)
CMYK
cmyk(0%, 11%, 32%, 18%)
Oklch
oklch(79.9% 0.065 82.5)

TraditionalGinger」· PaintWarm Sun」· Creative Honey Glow

#B98345

Ochre · Chocolate · Amber Brown

HEX
#B98345
RGB
rgb(185, 131, 69)
HSL
hsl(32, 46%, 50%)
HSB
hsb(32, 63%, 73%)
CMYK
cmyk(0%, 29%, 63%, 27%)
Oklch
oklch(65.1% 0.103 68.0)

TraditionalOchre」· PaintAmber Brown」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

0F0F07
07070E

Analogous

0E0A07
0F0F07
0A0E07

Triadic

0F0F07
070E0E
0E070E

Split-Comp.

0F0F07
070A0E
0A070E

Tetradic

0F0F07
070E0A
07070E
0E070A

Contrast Matrix WCAG 2.1 Contrast

0F0F07
6A7C66
DC564A
D2BA8E
B98345
4.3
AA Large
5.0
AA
10.2
AAA
5.9
AA
4.3
AA Large
1.2
Fail
2.4
Fail
1.4
Fail
5.0
AA
1.2
Fail
2.0
Fail
1.2
Fail
10.2
AAA
2.4
Fail
2.0
Fail
1.7
Fail
5.9
AA
1.4
Fail
1.2
Fail
1.7
Fail
White BG
19.2AAA
4.5AA Large
3.8AA Large
1.9Fail
3.3AA Large
Black BG
1.1Fail
4.7AA
5.5AA
11.2AAA
6.4AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

0F0F09
72726B
A2A14D
C8C799
A2A154

Deuteranopia

0F0F09
716F6D
AAB44E
C9CB9B
A5A958

Tritanopia

0F0A0B
6B7070
D54F50
D1A1A3
B66062

Achromatopsia

0E0E0E
747474
7D7D7D
BCBCBC
8C8C8C

Shades & Tints Shades & Tints

#0F0F07

Dark
Light

#6A7C66

Dark
Light

#DC564A

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #0f0f07;
  --color-2: #6a7c66;
  --color-3: #dc564a;
  --color-4: #d2ba8e;
  --color-5: #b98345;
}

SCSS

$color-1: #0f0f07;
$color-2: #6a7c66;
$color-3: #dc564a;
$color-4: #d2ba8e;
$color-5: #b98345;

TAILWIND

colors: {
  'brand-1': '#0f0f07',
  'brand-2': '#6a7c66',
  'brand-3': '#dc564a',
  'brand-4': '#d2ba8e',
  'brand-5': '#b98345',
}

RGB Array

[15, 15, 7], [106, 124, 102], [220, 86, 74], [210, 186, 142], [185, 131, 69]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #0F0F07, #6A7C66, #DC564A, #D2BA8E, #B98345 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: #0f0f07; --color-2: #6a7c66; --color-3: #dc564a; --color-4: #d2ba8e; --color-5: #b98345. 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