← Back to Editor

#231D2B · #63283C · #B75762 · #F0DCC4 · #36535B

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

#231D2B

Deep Indigo · Black · Dark Purple

HEX
#231D2B
RGB
rgb(35, 29, 43)
HSL
hsl(266, 19%, 14%)
HSB
hsb(266, 33%, 17%)
CMYK
cmyk(19%, 33%, 0%, 83%)
Oklch
oklch(24.4% 0.027 304.0)

Traditional「Deep Indigo」· Paint「Dark Purple」· Creative Blush Sunrise

#63283C

Dark Violet · DarkSlateGray · Camellia

HEX
#63283C
RGB
rgb(99, 40, 60)
HSL
hsl(340, 42%, 27%)
HSB
hsb(340, 60%, 39%)
CMYK
cmyk(0%, 60%, 39%, 61%)
Oklch
oklch(36.7% 0.088 1.1)

Traditional「Dark Violet」· Paint「Camellia」· Creative Blush Sunrise

#B75762

Crimson · Sienna · Passion Red

HEX
#B75762
RGB
rgb(183, 87, 98)
HSL
hsl(353, 40%, 53%)
HSB
hsb(353, 52%, 72%)
CMYK
cmyk(0%, 52%, 46%, 28%)
Oklch
oklch(57.8% 0.124 14.7)

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

#F0DCC4

Goose Yellow · Bisque · Peach Orange

HEX
#F0DCC4
RGB
rgb(240, 220, 196)
HSL
hsl(33, 59%, 85%)
HSB
hsb(33, 18%, 94%)
CMYK
cmyk(0%, 8%, 18%, 6%)
Oklch
oklch(90.4% 0.039 72.3)

Traditional「Goose Yellow」· Paint「Peach Orange」· Creative Honey Glow

#36535B

Slate Blue · DarkSlateGray · Mint Ice

HEX
#36535B
RGB
rgb(54, 83, 91)
HSL
hsl(193, 26%, 28%)
HSB
hsb(193, 41%, 36%)
CMYK
cmyk(41%, 9%, 0%, 64%)
Oklch
oklch(42.3% 0.037 216.9)

Traditional「Slate Blue」· Paint「Mint Ice」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

231D2B
252A1D

Analogous

1D1E2A
231D2B
2A1D2A

Triadic

231D2B
2A231D
1D2A23

Split-Comp.

231D2B
2A2A1D
1E2A1D

Tetradic

231D2B
2A1D1E
252A1D
1D2A2A

Contrast Matrix WCAG 2.1 Contrast

231D2B
63283C
B75762
F0DCC4
36535B
—
1.5
Fail
3.6
AA Large
12.3
AAA
2.0
Fail
1.5
Fail
—
2.4
Fail
8.3
AAA
1.3
Fail
3.6
AA Large
2.4
Fail
—
3.5
AA Large
1.8
Fail
12.3
AAA
8.3
AAA
3.5
AA Large
—
6.2
AA
2.0
Fail
1.3
Fail
1.8
Fail
6.2
AA
—
White BG
16.4AAA
11.1AAA
4.6AA
1.3Fail
8.3AAA
Black BG
1.3Fail
1.9Fail
4.6AA
15.7AAA
2.5Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

202028
494937
8D8D5F
E7E7CA
434359

Deuteranopia

212127
4D5136
939A5F
E9EACB
413F59

Tritanopia

232524
603333
B25D5D
EFCECF
375857

Achromatopsia

202020
3C3C3C
757575
DFDFDF
4B4B4B

Shades & Tints Shades & Tints

#231D2B

Dark
Light

#63283C

Dark
Light

#B75762

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #231d2b;
  --color-2: #63283c;
  --color-3: #b75762;
  --color-4: #f0dcc4;
  --color-5: #36535b;
}

SCSS

$color-1: #231d2b;
$color-2: #63283c;
$color-3: #b75762;
$color-4: #f0dcc4;
$color-5: #36535b;

TAILWIND

colors: {
  'brand-1': '#231d2b',
  'brand-2': '#63283c',
  'brand-3': '#b75762',
  'brand-4': '#f0dcc4',
  'brand-5': '#36535b',
}

RGB Array

[35, 29, 43], [99, 40, 60], [183, 87, 98], [240, 220, 196], [54, 83, 91]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #231D2B, #63283C, #B75762, #F0DCC4, #36535B 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: #231d2b; --color-2: #63283c; --color-3: #b75762; --color-4: #f0dcc4; --color-5: #36535b. 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