← Back to Editor

#423C3C · #FF4F4F · #FF873D · #898F68 · #D9DBBA

A 5-color palette palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#423C3C

Dark Cyan · DarkSlateGray · Dark Stone

HEX
#423C3C
RGB
rgb(66, 60, 60)
HSL
hsl(0, 5%, 25%)
HSB
hsb(0, 9%, 26%)
CMYK
cmyk(0%, 9%, 9%, 74%)
Oklch
oklch(36.2% 0.008 17.5)

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

#FF4F4F

Peach Pink · Tomato · Coral Red

HEX
#FF4F4F
RGB
rgb(255, 79, 79)
HSL
hsl(0, 100%, 65%)
HSB
hsb(0, 69%, 100%)
CMYK
cmyk(0%, 69%, 69%, 0%)
Oklch
oklch(67.5% 0.213 24.9)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

#FF873D

Apricot · Coral · Warm Sun

HEX
#FF873D
RGB
rgb(255, 135, 61)
HSL
hsl(23, 100%, 62%)
HSB
hsb(23, 76%, 100%)
CMYK
cmyk(0%, 47%, 76%, 0%)
Oklch
oklch(74.5% 0.169 49.1)

Traditional「Apricot」· Paint「Warm Sun」· Creative Honey Glow

#898F68

Autumn Sage · Gray · Honey Gold

HEX
#898F68
RGB
rgb(137, 143, 104)
HSL
hsl(69, 16%, 48%)
HSB
hsb(69, 27%, 56%)
CMYK
cmyk(4%, 0%, 27%, 44%)
Oklch
oklch(63.5% 0.056 115.1)

Traditional「Autumn Sage」· Paint「Honey Gold」· Creative Blush Sunrise

#D9DBBA

Fresh Green · LightGray · Lemon Cream

HEX
#D9DBBA
RGB
rgb(217, 219, 186)
HSL
hsl(64, 31%, 79%)
HSB
hsb(64, 15%, 86%)
CMYK
cmyk(1%, 0%, 15%, 14%)
Oklch
oklch(88.1% 0.044 110.1)

Traditional「Fresh Green」· Paint「Lemon Cream」· Creative Lemon Fizz

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

423C3C
3D4343

Analogous

433D40
423C3C
43403D

Triadic

423C3C
3D433D
3D3D43

Split-Comp.

423C3C
3D4340
3D4043

Tetradic

423C3C
40433D
3D4343
403D43

Contrast Matrix WCAG 2.1 Contrast

423C3C
FF4F4F
FF873D
898F68
D9DBBA
—
3.3
AA Large
4.5
AA
3.2
AA Large
7.6
AAA
3.3
AA Large
—
1.4
Fail
1.0
Fail
2.3
Fail
4.5
AA
1.4
Fail
—
1.4
Fail
1.7
Fail
3.2
AA Large
1.0
Fail
1.4
Fail
—
2.4
Fail
7.6
AAA
2.3
Fail
1.7
Fail
2.4
Fail
—
White BG
10.8AAA
3.2AA Large
2.4Fail
3.4AA Large
1.4Fail
Black BG
1.9Fail
6.5AA
8.8AAA
6.2AA
14.8AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

3F3F3C
B3B14F
CBCA4F
8C8C71
DADAC2

Deuteranopia

40403C
BDCA4F
D2DB53
8B8B74
DADAC4

Tritanopia

423C3C
F64F4F
F95D60
89797B
D9C8CA

Achromatopsia

3E3E3E
848484
A2A2A2
898989
D7D7D7

Shades & Tints Shades & Tints

#423C3C

Dark
Light

#FF4F4F

Dark
Light

#FF873D

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #423c3c;
  --color-2: #ff4f4f;
  --color-3: #ff873d;
  --color-4: #898f68;
  --color-5: #d9dbba;
}

SCSS

$color-1: #423c3c;
$color-2: #ff4f4f;
$color-3: #ff873d;
$color-4: #898f68;
$color-5: #d9dbba;

TAILWIND

colors: {
  'brand-1': '#423c3c',
  'brand-2': '#ff4f4f',
  'brand-3': '#ff873d',
  'brand-4': '#898f68',
  'brand-5': '#d9dbba',
}

RGB Array

[66, 60, 60], [255, 79, 79], [255, 135, 61], [137, 143, 104], [217, 219, 186]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #423C3C, #FF4F4F, #FF873D, #898F68, #D9DBBA 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: #423c3c; --color-2: #ff4f4f; --color-3: #ff873d; --color-4: #898f68; --color-5: #d9dbba. 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