← Back to Editor

#403E37 · #633D3A · #DE4053 · #B8A0A3 · #CBF2E2

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

#403E37

Ochre · DarkSlateGray · Dark Stone

HEX
#403E37
RGB
rgb(64, 62, 55)
HSL
hsl(47, 8%, 23%)
HSB
hsb(47, 14%, 25%)
CMYK
cmyk(0%, 3%, 14%, 75%)
Oklch
oklch(36.3% 0.012 93.8)

Traditional「Ochre」· Paint「Dark Stone」· Creative Midnight Shadow

#633D3A

Crimson · DarkOliveGreen · Wine Red

HEX
#633D3A
RGB
rgb(99, 61, 58)
HSL
hsl(4, 26%, 31%)
HSB
hsb(4, 41%, 39%)
CMYK
cmyk(0%, 38%, 41%, 61%)
Oklch
oklch(40.4% 0.054 24.7)

Traditional「Crimson」· Paint「Wine Red」· Creative Blush Sunrise

#DE4053

Vermilion · Tomato · Passion Red

HEX
#DE4053
RGB
rgb(222, 64, 83)
HSL
hsl(353, 71%, 56%)
HSB
hsb(353, 71%, 87%)
CMYK
cmyk(0%, 71%, 63%, 13%)
Oklch
oklch(60.7% 0.194 18.6)

Traditional「Vermilion」· Paint「Passion Red」· Creative Blush Sunrise

#B8A0A3

Peach Pink · DarkGray · Coral Red

HEX
#B8A0A3
RGB
rgb(184, 160, 163)
HSL
hsl(353, 14%, 67%)
HSB
hsb(353, 13%, 72%)
CMYK
cmyk(0%, 13%, 11%, 28%)
Oklch
oklch(72.8% 0.029 9.3)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Rose Petal

#CBF2E2

Jade · LightGray · Mint Green

HEX
#CBF2E2
RGB
rgb(203, 242, 226)
HSL
hsl(155, 60%, 87%)
HSB
hsb(155, 16%, 95%)
CMYK
cmyk(16%, 0%, 7%, 5%)
Oklch
oklch(92.9% 0.046 168.6)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

403E37
36383F

Analogous

3F3936
403E37
3D3F36

Triadic

403E37
363F3D
3D363F

Split-Comp.

403E37
363D3F
39363F

Tetradic

403E37
363F39
36383F
3F363D

Contrast Matrix WCAG 2.1 Contrast

403E37
633D3A
DE4053
B8A0A3
CBF2E2
—
1.2
Fail
2.5
Fail
4.4
AA Large
8.8
AAA
1.2
Fail
—
2.2
Fail
3.8
AA Large
7.7
AAA
2.5
Fail
2.2
Fail
—
1.7
Fail
3.5
AA Large
4.4
AA Large
3.8
AA Large
1.7
Fail
—
2.0
Fail
8.8
AAA
7.7
AAA
3.5
AA Large
2.0
Fail
—
White BG
10.7AAA
9.3AAA
4.2AA Large
2.4Fail
1.2Fail
Black BG
2.0Fail
2.3Fail
5.0AA
8.6AAA
17.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

3F3F39
53523B
9A984E
AEADA2
DCDCE6

Deuteranopia

3F3F39
55583B
A3AF4D
AFB1A2
DAD7E7

Tritanopia

403A3A
613B3B
D64B4A
B7A2A2
CDE9EA

Achromatopsia

3E3E3E
484848
717171
A8A8A8
E5E5E5

Shades & Tints Shades & Tints

#403E37

Dark
Light

#633D3A

Dark
Light

#DE4053

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #403e37;
  --color-2: #633d3a;
  --color-3: #de4053;
  --color-4: #b8a0a3;
  --color-5: #cbf2e2;
}

SCSS

$color-1: #403e37;
$color-2: #633d3a;
$color-3: #de4053;
$color-4: #b8a0a3;
$color-5: #cbf2e2;

TAILWIND

colors: {
  'brand-1': '#403e37',
  'brand-2': '#633d3a',
  'brand-3': '#de4053',
  'brand-4': '#b8a0a3',
  'brand-5': '#cbf2e2',
}

RGB Array

[64, 62, 55], [99, 61, 58], [222, 64, 83], [184, 160, 163], [203, 242, 226]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #403E37, #633D3A, #DE4053, #B8A0A3, #CBF2E2 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: #403e37; --color-2: #633d3a; --color-3: #de4053; --color-4: #b8a0a3; --color-5: #cbf2e2. 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