← Back to Editor

#340C0C · #B4A68B · #C4EBD9 · #83B49E · #414D41

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

#340C0C

Vermilion · Black · Deep Berry

HEX
#340C0C
RGB
rgb(52, 12, 12)
HSL
hsl(0, 63%, 13%)
HSB
hsb(0, 77%, 20%)
CMYK
cmyk(0%, 77%, 77%, 80%)
Oklch
oklch(22.5% 0.065 23.9)

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

#B4A68B

Ginger · DarkGray · Sunflower

HEX
#B4A68B
RGB
rgb(180, 166, 139)
HSL
hsl(40, 21%, 63%)
HSB
hsb(40, 23%, 71%)
CMYK
cmyk(0%, 8%, 23%, 29%)
Oklch
oklch(73.0% 0.041 83.8)

Traditional「Ginger」· Paint「Sunflower」· Creative Lemon Fizz

#C4EBD9

Jade · LightGray · Mint Green

HEX
#C4EBD9
RGB
rgb(196, 235, 217)
HSL
hsl(152, 49%, 85%)
HSB
hsb(152, 17%, 92%)
CMYK
cmyk(17%, 0%, 8%, 8%)
Oklch
oklch(90.7% 0.047 165.7)

Traditional「Jade」· Paint「Mint Green」· Creative Arctic Pool

#83B49E

Jade · DarkSeaGreen · Apple Green

HEX
#83B49E
RGB
rgb(131, 180, 158)
HSL
hsl(153, 25%, 61%)
HSB
hsb(153, 27%, 71%)
CMYK
cmyk(27%, 0%, 12%, 29%)
Oklch
oklch(72.9% 0.061 165.3)

Traditional「Jade」· Paint「Apple Green」· Creative Arctic Pool

#414D41

Celadon · DarkSlateGray · Charcoal

HEX
#414D41
RGB
rgb(65, 77, 65)
HSL
hsl(120, 8%, 28%)
HSB
hsb(120, 16%, 30%)
CMYK
cmyk(16%, 0%, 16%, 70%)
Oklch
oklch(40.6% 0.025 145.1)

Traditional「Celadon」· Paint「Charcoal」· Creative Midnight Shadow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

340C0C
0C3636

Analogous

360C21
340C0C
36210C

Triadic

340C0C
0C360C
0C0C36

Split-Comp.

340C0C
0C3621
0C2136

Tetradic

340C0C
21360C
0C3636
210C36

Contrast Matrix WCAG 2.1 Contrast

340C0C
B4A68B
C4EBD9
83B49E
414D41
—
7.3
AAA
13.5
AAA
7.5
AAA
2.0
Fail
7.3
AAA
—
1.9
Fail
1.0
Fail
3.7
AA Large
13.5
AAA
1.9
Fail
—
1.8
Fail
6.9
AA
7.5
AAA
1.0
Fail
1.8
Fail
—
3.8
AA Large
2.0
Fail
3.7
AA Large
6.9
AA
3.8
AA Large
—
White BG
17.4AAA
2.4Fail
1.3Fail
2.3Fail
8.9AAA
Black BG
1.2Fail
8.8AAA
16.2AAA
9.0AAA
2.4Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

23220C
AEAE92
D5D5DD
9899A3
464644

Deuteranopia

25280C
AFB093
D3D0DE
9592A5
464545

Tritanopia

320C0C
B39798
C6E1E2
85A8A8
424647

Achromatopsia

181818
A7A7A7
DDDDDD
A3A3A3
484848

Shades & Tints Shades & Tints

#340C0C

Dark
Light

#B4A68B

Dark
Light

#C4EBD9

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #340c0c;
  --color-2: #b4a68b;
  --color-3: #c4ebd9;
  --color-4: #83b49e;
  --color-5: #414d41;
}

SCSS

$color-1: #340c0c;
$color-2: #b4a68b;
$color-3: #c4ebd9;
$color-4: #83b49e;
$color-5: #414d41;

TAILWIND

colors: {
  'brand-1': '#340c0c',
  'brand-2': '#b4a68b',
  'brand-3': '#c4ebd9',
  'brand-4': '#83b49e',
  'brand-5': '#414d41',
}

RGB Array

[52, 12, 12], [180, 166, 139], [196, 235, 217], [131, 180, 158], [65, 77, 65]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #340C0C, #B4A68B, #C4EBD9, #83B49E, #414D41 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: #340c0c; --color-2: #b4a68b; --color-3: #c4ebd9; --color-4: #83b49e; --color-5: #414d41. 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