#632F31 + #9F4757 + #CA7D5F + #D7BA74 + #859BCA · warm - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#632F31

Crimson · DarkOliveGreen · Wine Red

HEX

#632F31

RGB

rgb(99, 47, 49)

HSL

hsl(358, 36%, 29%)

HSB

hsb(358, 53%, 39%)

CMYK

cmyk(0%, 53%, 51%, 61%)

Oklch

oklch(37.5% 0.075 19.0)

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

#9F4757

Crimson · Sienna · Passion Red

HEX

#9F4757

RGB

rgb(159, 71, 87)

HSL

hsl(349, 38%, 45%)

HSB

hsb(349, 55%, 62%)

CMYK

cmyk(0%, 55%, 45%, 38%)

Oklch

oklch(51.6% 0.118 10.8)

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

#CA7D5F

Tangerine · DarkSalmon · Warm Sun

HEX

#CA7D5F

RGB

rgb(202, 125, 95)

HSL

hsl(17, 50%, 58%)

HSB

hsb(17, 53%, 79%)

CMYK

cmyk(0%, 38%, 53%, 21%)

Oklch

oklch(66.5% 0.105 41.9)

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

#D7BA74

Ginger · BurlyWood · Sunflower

HEX

#D7BA74

RGB

rgb(215, 186, 116)

HSL

hsl(42, 55%, 65%)

HSB

hsb(42, 46%, 84%)

CMYK

cmyk(0%, 13%, 46%, 16%)

Oklch

oklch(79.9% 0.095 87.7)

Traditional「Ginger」· Paint「Sunflower」· Creative Lemon Fizz

#859BCA

Azure · CornflowerBlue · Cobalt Blue

HEX

#859BCA

RGB

rgb(133, 155, 202)

HSL

hsl(221, 39%, 66%)

HSB

hsb(221, 34%, 79%)

CMYK

cmyk(34%, 23%, 0%, 21%)

Oklch

oklch(69.0% 0.074 265.0)

Traditional「Azure」· Paint「Cobalt Blue」· Creative Twilight Haze

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

632F31

2F6563

Analogous

652F4C

632F31

65482F

Triadic

632F31

31652F

2F3165

Split-Comp.

632F31

2F6548

2F4C65

Tetradic

632F31

4C652F

2F6563

482F65

Contrast Matrix WCAG 2.1 Contrast

632F31	9F4757	CA7D5F	D7BA74	859BCA
—	1.8 Fail	3.3 AA Large	5.6 AA	3.8 AA Large
1.8 Fail	—	1.9 Fail	3.2 AA Large	2.1 Fail
3.3 AA Large	1.9 Fail	—	1.7 Fail	1.1 Fail
5.6 AA	3.2 AA Large	1.7 Fail	—	1.5 Fail
3.8 AA Large	2.1 Fail	1.1 Fail	1.5 Fail	—

White BG

10.6AAA

6.0AA

3.2AA Large

1.9Fail

2.8Fail

Black BG

2.0Fail

3.5AA Large

6.6AA

11.2AAA

7.5AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

4C4C31

797853

A9A866

CACA85

8F8FBF

Deuteranopia

505330

7E8552

ADB368

CCCE89

8D8CBC

Tritanopia

603030

9B504F

C66C6D

D69295

86B6B4

Achromatopsia

3F3F3F

636363

919191

BBBBBB

9A9A9A

Shades & Tints Shades & Tints

#632F31

Dark

Light

#9F4757

Dark

Light

#CA7D5F

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #632f31;
  --color-2: #9f4757;
  --color-3: #ca7d5f;
  --color-4: #d7ba74;
  --color-5: #859bca;
}

SCSS

$color-1: #632f31;
$color-2: #9f4757;
$color-3: #ca7d5f;
$color-4: #d7ba74;
$color-5: #859bca;

TAILWIND

colors: {
  'brand-1': '#632f31',
  'brand-2': '#9f4757',
  'brand-3': '#ca7d5f',
  'brand-4': '#d7ba74',
  'brand-5': '#859bca',
}

RGB Array

[99, 47, 49], [159, 71, 87], [202, 125, 95], [215, 186, 116], [133, 155, 202]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This warm-style palette of #632F31, #9F4757, #CA7D5F, #D7BA74, #859BCA is ideal for: corporate websites, product showcases, portfolios. 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: #632f31; --color-2: #9f4757; --color-3: #ca7d5f; --color-4: #d7ba74; --color-5: #859bca. 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. 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