← Back to Editor

#243D49 · #5E6864 · #EFE5BB · #F0425A · #180D0B

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

#243D49

Slate Blue · DarkSlateGray · Peacock Green

HEX
#243D49
RGB
rgb(36, 61, 73)
HSL
hsl(199, 34%, 21%)
HSB
hsb(199, 51%, 29%)
CMYK
cmyk(51%, 16%, 0%, 71%)
Oklch
oklch(34.5% 0.037 230.0)

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

#5E6864

Ink Gray · DimGray · Charcoal

HEX
#5E6864
RGB
rgb(94, 104, 100)
HSL
hsl(156, 5%, 39%)
HSB
hsb(156, 10%, 41%)
CMYK
cmyk(10%, 0%, 4%, 59%)
Oklch
oklch(50.7% 0.014 169.8)

Traditional「Ink Gray」· Paint「Charcoal」· Creative Midnight Shadow

#EFE5BB

Goose Yellow · Wheat · Lemon Cream

HEX
#EFE5BB
RGB
rgb(239, 229, 187)
HSL
hsl(48, 62%, 84%)
HSB
hsb(48, 22%, 94%)
CMYK
cmyk(0%, 4%, 22%, 6%)
Oklch
oklch(91.9% 0.056 96.2)

Traditional「Goose Yellow」· Paint「Lemon Cream」· Creative Lemon Fizz

#F0425A

Vermilion · Tomato · Passion Red

HEX
#F0425A
RGB
rgb(240, 66, 90)
HSL
hsl(352, 85%, 60%)
HSB
hsb(352, 73%, 94%)
CMYK
cmyk(0%, 73%, 62%, 6%)
Oklch
oklch(64.0% 0.209 18.0)

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

#180D0B

Crimson · Black · Deep Berry

HEX
#180D0B
RGB
rgb(24, 13, 11)
HSL
hsl(9, 37%, 7%)
HSB
hsb(9, 54%, 9%)
CMYK
cmyk(0%, 46%, 54%, 91%)
Oklch
oklch(17.4% 0.020 30.6)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

243D49
482F23

Analogous

234841
243D49
232A48

Triadic

243D49
48233C
3C4823

Split-Comp.

243D49
48232A
484123

Tetradic

243D49
412348
482F23
2A4823

Contrast Matrix WCAG 2.1 Contrast

243D49
5E6864
EFE5BB
F0425A
180D0B
—
2.0
Fail
9.0
AAA
3.1
AA Large
1.7
Fail
2.0
Fail
—
4.6
AA
1.5
Fail
3.3
AA Large
9.0
AAA
4.6
AA
—
2.9
Fail
15.1
AAA
3.1
AA Large
1.5
Fail
2.9
Fail
—
5.1
AA
1.7
Fail
3.3
AA Large
15.1
AAA
5.1
AA
—
White BG
11.4AAA
5.8AA
1.3Fail
3.7AA Large
19.1AAA
Black BG
1.8Fail
3.6AA Large
16.6AAA
5.6AA
1.1Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

2F2F46
626265
EBEBC5
A5A354
13130B

Deuteranopia

2D2C45
626165
EBECC8
AFBC53
14150C

Tritanopia

254443
5F6666
EECDCF
E7504F
170C0C

Achromatopsia

373737
656565
E3E3E3
797979
101010

Shades & Tints Shades & Tints

#243D49

Dark
Light

#5E6864

Dark
Light

#EFE5BB

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #243d49;
  --color-2: #5e6864;
  --color-3: #efe5bb;
  --color-4: #f0425a;
  --color-5: #180d0b;
}

SCSS

$color-1: #243d49;
$color-2: #5e6864;
$color-3: #efe5bb;
$color-4: #f0425a;
$color-5: #180d0b;

TAILWIND

colors: {
  'brand-1': '#243d49',
  'brand-2': '#5e6864',
  'brand-3': '#efe5bb',
  'brand-4': '#f0425a',
  'brand-5': '#180d0b',
}

RGB Array

[36, 61, 73], [94, 104, 100], [239, 229, 187], [240, 66, 90], [24, 13, 11]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #243D49, #5E6864, #EFE5BB, #F0425A, #180D0B 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: #243d49; --color-2: #5e6864; --color-3: #efe5bb; --color-4: #f0425a; --color-5: #180d0b. 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