← Back to Editor

#DFA689 · #C9553C · #AD2C30 · #452443 · #010101

warm

A 5-color warm 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

#DFA689

Apricot · BurlyWood · Warm Sun

HEX
#DFA689
RGB
rgb(223, 166, 137)
HSL
hsl(20, 57%, 71%)
HSB
hsb(20, 39%, 87%)
CMYK
cmyk(0%, 26%, 39%, 13%)
Oklch
oklch(77.1% 0.079 48.1)

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

#C9553C

Crimson · Chocolate · Passion Red

HEX
#C9553C
RGB
rgb(201, 85, 60)
HSL
hsl(11, 57%, 51%)
HSB
hsb(11, 70%, 79%)
CMYK
cmyk(0%, 58%, 70%, 21%)
Oklch
oklch(59.4% 0.154 33.7)

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

#AD2C30

Crimson · Brown · Passion Red

HEX
#AD2C30
RGB
rgb(173, 44, 48)
HSL
hsl(358, 59%, 43%)
HSB
hsb(358, 75%, 68%)
CMYK
cmyk(0%, 75%, 72%, 32%)
Oklch
oklch(49.8% 0.165 24.1)

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

#452443

Rose Purple · DarkSlateGray · Eggplant

HEX
#452443
RGB
rgb(69, 36, 67)
HSL
hsl(304, 31%, 21%)
HSB
hsb(304, 48%, 27%)
CMYK
cmyk(0%, 48%, 3%, 73%)
Oklch
oklch(31.7% 0.069 329.3)

Traditional「Rose Purple」· Paint「Eggplant」· Creative Blush Sunrise

#010101

Ink Black · Black · Jet Black

HEX
#010101
RGB
rgb(1, 1, 1)
HSL
hsl(0, 0%, 0%)
HSB
hsb(0, 0%, 0%)
CMYK
cmyk(0%, 0%, 0%, 100%)
Oklch
oklch(6.7% 0.000 89.9)

Traditional「Ink Black」· Paint「Jet Black」· Creative Midnight Shadow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

DFA689
8BC3DF

Analogous

DF8B99
DFA689
DFD18B

Triadic

DFA689
8BDFA7
A78BDF

Split-Comp.

DFA689
8BDFD1
8B99DF

Tetradic

DFA689
99DF8B
8BC3DF
D18BDF

Contrast Matrix WCAG 2.1 Contrast

DFA689
C9553C
AD2C30
452443
010101
—
2.1
Fail
3.1
AA Large
6.3
AA
9.9
AAA
2.1
Fail
—
1.5
Fail
3.1
AA Large
4.8
AA
3.1
AA Large
1.5
Fail
—
2.0
Fail
3.2
AA Large
6.3
AA
3.1
AA Large
2.0
Fail
—
1.6
Fail
9.9
AAA
4.8
AA
3.2
AA Large
1.6
Fail
—
White BG
2.1Fail
4.3AA Large
6.6AA
13.2AAA
20.9AAA
Black BG
10.0AAA
4.8AA
3.2AA Large
1.6Fail
1.0Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

C6C690
979642
75742F
37363B
010101

Deuteranopia

CACE92
9EA644
7D862F
393B3A
010101

Tritanopia

DC9697
C34748
A72E2E
433634
010101

Achromatopsia

B4B4B4
757575
535353
313131
010101

Shades & Tints Shades & Tints

#DFA689

Dark
Light

#C9553C

Dark
Light

#AD2C30

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #dfa689;
  --color-2: #c9553c;
  --color-3: #ad2c30;
  --color-4: #452443;
  --color-5: #010101;
}

SCSS

$color-1: #dfa689;
$color-2: #c9553c;
$color-3: #ad2c30;
$color-4: #452443;
$color-5: #010101;

TAILWIND

colors: {
  'brand-1': '#dfa689',
  'brand-2': '#c9553c',
  'brand-3': '#ad2c30',
  'brand-4': '#452443',
  'brand-5': '#010101',
}

RGB Array

[223, 166, 137], [201, 85, 60], [173, 44, 48], [69, 36, 67], [1, 1, 1]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This warm-style palette of #DFA689, #C9553C, #AD2C30, #452443, #010101 is ideal for: tech websites, dark mode UIs, game UIs, 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: #dfa689; --color-2: #c9553c; --color-3: #ad2c30; --color-4: #452443; --color-5: #010101. 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?

Dark tones work well as backgrounds; pair with light text for readability. Use the brightest color for CTA buttons and interactive elements. 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 warm-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