#900D1F + #A22126 + #B52F23 + #AAA549 + #B4AF6D · warm - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#900D1F

Vermilion · DarkRed · Wine Red

HEX

#900D1F

RGB

rgb(144, 13, 31)

HSL

hsl(352, 83%, 31%)

HSB

hsb(352, 91%, 56%)

CMYK

cmyk(0%, 91%, 78%, 44%)

Oklch

oklch(41.8% 0.161 22.6)

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

#A22126

Vermilion · Brown · Wine Red

HEX

#A22126

RGB

rgb(162, 33, 38)

HSL

hsl(358, 66%, 38%)

HSB

hsb(358, 80%, 64%)

CMYK

cmyk(0%, 80%, 77%, 36%)

Oklch

oklch(46.7% 0.165 24.7)

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

#B52F23

Vermilion · FireBrick · Passion Red

HEX

#B52F23

RGB

rgb(181, 47, 35)

HSL

hsl(5, 68%, 42%)

HSB

hsb(5, 81%, 71%)

CMYK

cmyk(0%, 74%, 81%, 29%)

Oklch

oklch(51.3% 0.173 29.5)

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

#AAA549

Autumn Sage · GoldenRod · Honey Gold

HEX

#AAA549

RGB

rgb(170, 165, 73)

HSL

hsl(57, 40%, 48%)

HSB

hsb(57, 57%, 67%)

CMYK

cmyk(0%, 3%, 57%, 33%)

Oklch

oklch(70.7% 0.114 106.1)

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

#B4AF6D

Autumn Sage · Tan · Sunflower

HEX

#B4AF6D

RGB

rgb(180, 175, 109)

HSL

hsl(56, 32%, 57%)

HSB

hsb(56, 39%, 71%)

CMYK

cmyk(0%, 3%, 39%, 29%)

Oklch

oklch(74.3% 0.087 104.6)

Traditional「Autumn Sage」· Paint「Sunflower」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

900D1F

0D917F

Analogous

910D61

900D1F

913E0D

Triadic

900D1F

1F910D

0D1F91

Split-Comp.

900D1F

0D913E

0D6191

Tetradic

900D1F

61910D

0D917F

3E0D91

Contrast Matrix WCAG 2.1 Contrast

900D1F	A22126	B52F23	AAA549	B4AF6D
—	1.2 Fail	1.5 Fail	3.6 AA Large	4.1 AA Large
1.2 Fail	—	1.2 Fail	2.9 Fail	3.3 AA Large
1.5 Fail	1.2 Fail	—	2.4 Fail	2.7 Fail
3.6 AA Large	2.9 Fail	2.4 Fail	—	1.1 Fail
4.1 AA Large	3.3 AA Large	2.7 Fail	1.1 Fail	—

White BG

9.3AAA

7.5AAA

6.2AA

2.6Fail

2.3Fail

Black BG

2.3Fail

2.8Fail

3.4AA Large

8.2AAA

9.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

57561B

6A6925

7B7A26

A8A85F

B2B27D

Deuteranopia

5F691A

727B25

838D27

A8A965

B2B381

Tritanopia

891716

9C2424

AE2829

AA7175

B48A8C

Achromatopsia

363636

484848

565656

9C9C9C

A9A9A9

Shades & Tints Shades & Tints

#900D1F

Dark

Light

#A22126

Dark

Light

#B52F23

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #900d1f;
  --color-2: #a22126;
  --color-3: #b52f23;
  --color-4: #aaa549;
  --color-5: #b4af6d;
}

SCSS

$color-1: #900d1f;
$color-2: #a22126;
$color-3: #b52f23;
$color-4: #aaa549;
$color-5: #b4af6d;

TAILWIND

colors: {
  'brand-1': '#900d1f',
  'brand-2': '#a22126',
  'brand-3': '#b52f23',
  'brand-4': '#aaa549',
  'brand-5': '#b4af6d',
}

RGB Array

[144, 13, 31], [162, 33, 38], [181, 47, 35], [170, 165, 73], [180, 175, 109]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This warm-style palette of #900D1F, #A22126, #B52F23, #AAA549, #B4AF6D 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: #900d1f; --color-2: #a22126; --color-3: #b52f23; --color-4: #aaa549; --color-5: #b4af6d. 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