← Back to Editor

#642C47 · #733655 · #9F7871 · #F2C8CC · #D8A056

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

#642C47

Dark Violet · DarkSlateGray · Camellia

HEX
#642C47
RGB
rgb(100, 44, 71)
HSL
hsl(331, 39%, 28%)
HSB
hsb(331, 56%, 39%)
CMYK
cmyk(0%, 56%, 29%, 61%)
Oklch
oklch(37.9% 0.088 351.9)

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

#733655

Dark Violet · DimGray · Camellia

HEX
#733655
RGB
rgb(115, 54, 85)
HSL
hsl(330, 36%, 33%)
HSB
hsb(330, 53%, 45%)
CMYK
cmyk(0%, 53%, 26%, 55%)
Oklch
oklch(42.3% 0.094 350.1)

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

#9F7871

Crimson · Gray · Passion Red

HEX
#9F7871
RGB
rgb(159, 120, 113)
HSL
hsl(9, 19%, 53%)
HSB
hsb(9, 29%, 62%)
CMYK
cmyk(0%, 25%, 29%, 38%)
Oklch
oklch(60.9% 0.050 30.2)

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

#F2C8CC

Peach Pink · Pink · Cherry Blossom

HEX
#F2C8CC
RGB
rgb(242, 200, 204)
HSL
hsl(354, 62%, 87%)
HSB
hsb(354, 17%, 95%)
CMYK
cmyk(0%, 17%, 16%, 5%)
Oklch
oklch(87.0% 0.048 11.7)

Traditional「Peach Pink」· Paint「Cherry Blossom」· Creative Rose Petal

#D8A056

Ginger · SandyBrown · Warm Sun

HEX
#D8A056
RGB
rgb(216, 160, 86)
HSL
hsl(34, 63%, 59%)
HSB
hsb(34, 60%, 85%)
CMYK
cmyk(0%, 26%, 60%, 15%)
Oklch
oklch(74.4% 0.113 72.2)

Traditional「Ginger」· Paint「Warm Sun」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

642C47
2C6348

Analogous

632C62
642C47
632C2C

Triadic

642C47
46632C
2C4663

Split-Comp.

642C47
2C632C
2C6263

Tetradic

642C47
62632C
2C6348
2C2C63

Contrast Matrix WCAG 2.1 Contrast

642C47
733655
9F7871
F2C8CC
D8A056
—
1.2
Fail
2.7
Fail
7.0
AA
4.6
AA
1.2
Fail
—
2.3
Fail
5.8
AA
3.8
AA Large
2.7
Fail
2.3
Fail
—
2.6
Fail
1.7
Fail
7.0
AA
5.8
AA
2.6
Fail
—
1.5
Fail
4.6
AA
3.8
AA Large
1.7
Fail
1.5
Fail
—
White BG
10.5AAA
8.8AAA
3.9AA Large
1.5Fail
2.3Fail
Black BG
2.0Fail
2.4Fail
5.4AA
13.9AAA
9.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

4C4B40
59584D
8E8E73
E0DFCB
C0BF68

Deuteranopia

4F533F
5C614C
909373
E2E5CB
C3C76C

Tritanopia

613B3A
704846
9D7474
F0CACA
D57679

Achromatopsia

404040
4C4C4C
838383
D5D5D5
A8A8A8

Shades & Tints Shades & Tints

#642C47

Dark
Light

#733655

Dark
Light

#9F7871

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #642c47;
  --color-2: #733655;
  --color-3: #9f7871;
  --color-4: #f2c8cc;
  --color-5: #d8a056;
}

SCSS

$color-1: #642c47;
$color-2: #733655;
$color-3: #9f7871;
$color-4: #f2c8cc;
$color-5: #d8a056;

TAILWIND

colors: {
  'brand-1': '#642c47',
  'brand-2': '#733655',
  'brand-3': '#9f7871',
  'brand-4': '#f2c8cc',
  'brand-5': '#d8a056',
}

RGB Array

[100, 44, 71], [115, 54, 85], [159, 120, 113], [242, 200, 204], [216, 160, 86]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This warm-style palette of #642C47, #733655, #9F7871, #F2C8CC, #D8A056 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: #642c47; --color-2: #733655; --color-3: #9f7871; --color-4: #f2c8cc; --color-5: #d8a056. 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 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