← Back to Editor

#000718 · #0C4441 · #687E57 · #9B824C · #DC9940

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

#000718

Indigo · Black · Deep Sea Blue

HEX
#000718
RGB
rgb(0, 7, 24)
HSL
hsl(223, 100%, 5%)
HSB
hsb(223, 100%, 9%)
CMYK
cmyk(100%, 71%, 0%, 91%)
Oklch
oklch(13.1% 0.043 255.0)

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

#0C4441

Mineral Blue · DarkSlateGray · Peacock Green

HEX
#0C4441
RGB
rgb(12, 68, 65)
HSL
hsl(177, 70%, 16%)
HSB
hsb(177, 82%, 27%)
CMYK
cmyk(82%, 0%, 4%, 73%)
Oklch
oklch(35.1% 0.055 189.5)

Traditional「Mineral Blue」· Paint「Peacock Green」· Creative Blush Sunrise

#687E57

Celadon · DimGray · Olive Green

HEX
#687E57
RGB
rgb(104, 126, 87)
HSL
hsl(94, 18%, 42%)
HSB
hsb(94, 31%, 49%)
CMYK
cmyk(17%, 0%, 31%, 51%)
Oklch
oklch(56.5% 0.063 132.1)

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

#9B824C

Ochre · Sienna · Honey Gold

HEX
#9B824C
RGB
rgb(155, 130, 76)
HSL
hsl(41, 34%, 45%)
HSB
hsb(41, 51%, 61%)
CMYK
cmyk(0%, 16%, 51%, 39%)
Oklch
oklch(61.8% 0.079 85.3)

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

#DC9940

Ginger · GoldenRod · Warm Sun

HEX
#DC9940
RGB
rgb(220, 153, 64)
HSL
hsl(34, 69%, 56%)
HSB
hsb(34, 71%, 86%)
CMYK
cmyk(0%, 30%, 71%, 14%)
Oklch
oklch(73.3% 0.131 70.6)

Traditional「Ginger」· Paint「Warm Sun」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

000718
1A1200

Analogous

00141A
000718
06001A

Triadic

000718
1A0007
071A00

Split-Comp.

000718
1A0600
141A00

Tetradic

000718
1A0014
1A1200
001A06

Contrast Matrix WCAG 2.1 Contrast

000718
0C4441
687E57
9B824C
DC9940
—
1.8
Fail
4.5
AA
5.5
AA
8.3
AAA
1.8
Fail
—
2.5
Fail
3.0
Fail
4.5
AA
4.5
AA
2.5
Fail
—
1.2
Fail
1.8
Fail
5.5
AA
3.0
Fail
1.2
Fail
—
1.5
Fail
8.3
AAA
4.5
AA
1.8
Fail
1.5
Fail
—
White BG
20.1AAA
10.9AAA
4.5AA Large
3.7AA Large
2.4Fail
Black BG
1.0Fail
1.9Fail
4.7AA
5.7AA
8.7AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

030314
242542
727260
909059
BFBE56

Deuteranopia

030213
211D42
706F63
92945C
C3C85B

Tritanopia

001110
0F4242
69686A
9A6366
D9676A

Achromatopsia

070707
333333
737373
838383
A3A3A3

Shades & Tints Shades & Tints

#000718

Dark
Light

#0C4441

Dark
Light

#687E57

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #000718;
  --color-2: #0c4441;
  --color-3: #687e57;
  --color-4: #9b824c;
  --color-5: #dc9940;
}

SCSS

$color-1: #000718;
$color-2: #0c4441;
$color-3: #687e57;
$color-4: #9b824c;
$color-5: #dc9940;

TAILWIND

colors: {
  'brand-1': '#000718',
  'brand-2': '#0c4441',
  'brand-3': '#687e57',
  'brand-4': '#9b824c',
  'brand-5': '#dc9940',
}

RGB Array

[0, 7, 24], [12, 68, 65], [104, 126, 87], [155, 130, 76], [220, 153, 64]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #000718, #0C4441, #687E57, #9B824C, #DC9940 is ideal for: tech websites, dark mode UIs, game UIs, 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: #000718; --color-2: #0c4441; --color-3: #687e57; --color-4: #9b824c; --color-5: #dc9940. 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 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