← Back to Editor

#483018 · #90A890 · #C04830 · #D89030 · #F0D890

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

#483018

Ochre · DarkOliveGreen · Cinnamon

HEX
#483018
RGB
rgb(72, 48, 24)
HSL
hsl(30, 50%, 19%)
HSB
hsb(30, 67%, 28%)
CMYK
cmyk(0%, 33%, 67%, 72%)
Oklch
oklch(33.2% 0.051 64.5)

TraditionalOchre」· PaintCinnamon」· Creative Blush Sunrise

#90A890

Celadon · DarkSeaGreen · Apple Green

HEX
#90A890
RGB
rgb(144, 168, 144)
HSL
hsl(120, 12%, 61%)
HSB
hsb(120, 14%, 66%)
CMYK
cmyk(14%, 0%, 14%, 34%)
Oklch
oklch(70.6% 0.044 145.1)

TraditionalCeladon」· PaintApple Green」· Creative Mint Breeze

#C04830

Crimson · Sienna · Passion Red

HEX
#C04830
RGB
rgb(192, 72, 48)
HSL
hsl(10, 60%, 47%)
HSB
hsb(10, 75%, 75%)
CMYK
cmyk(0%, 63%, 75%, 25%)
Oklch
oklch(56.1% 0.159 33.2)

TraditionalCrimson」· PaintPassion Red」· Creative Blush Sunrise

#D89030

Ginger · GoldenRod · Warm Sun

HEX
#D89030
RGB
rgb(216, 144, 48)
HSL
hsl(34, 68%, 52%)
HSB
hsb(34, 78%, 85%)
CMYK
cmyk(0%, 33%, 78%, 15%)
Oklch
oklch(71.0% 0.137 69.2)

TraditionalGinger」· PaintWarm Sun」· Creative Blush Sunrise

#F0D890

Goose Yellow · Khaki · Sunflower

HEX
#F0D890
RGB
rgb(240, 216, 144)
HSL
hsl(45, 76%, 75%)
HSB
hsb(45, 40%, 94%)
CMYK
cmyk(0%, 10%, 40%, 6%)
Oklch
oklch(88.6% 0.095 91.7)

TraditionalGoose Yellow」· PaintSunflower」· Creative Lemon Fizz

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

483018
183049

Analogous

491818
483018
494918

Triadic

483018
184930
301849

Split-Comp.

483018
184949
181849

Tetradic

483018
184918
183049
491849

Contrast Matrix WCAG 2.1 Contrast

483018
90A890
C04830
D89030
F0D890
4.8
AA
2.5
Fail
4.6
AA
8.7
AAA
4.8
AA
1.9
Fail
1.0
Fail
1.8
Fail
2.5
Fail
1.9
Fail
1.9
Fail
3.5
AA Large
4.6
AA
1.0
Fail
1.9
Fail
1.9
Fail
8.7
AAA
1.8
Fail
3.5
AA Large
1.9
Fail
White BG
12.3AAA
2.6Fail
5.0AA
2.6Fail
1.4Fail
Black BG
1.7Fail
8.2AAA
4.2AA Large
8.0AAA
14.9AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

3E3D1E
9A9B96
8C8B36
B9B847
E6E5A1

Deuteranopia

3F411F
999797
939C37
BDC24D
E7E9A6

Tritanopia

472223
919A9B
BA3A3B
D45A5E
EFAFB2

Achromatopsia

343434
9E9E9E
696969
9B9B9B
D7D7D7

Shades & Tints Shades & Tints

#483018

Dark
Light

#90A890

Dark
Light

#C04830

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #483018;
  --color-2: #90a890;
  --color-3: #c04830;
  --color-4: #d89030;
  --color-5: #f0d890;
}

SCSS

$color-1: #483018;
$color-2: #90a890;
$color-3: #c04830;
$color-4: #d89030;
$color-5: #f0d890;

TAILWIND

colors: {
  'brand-1': '#483018',
  'brand-2': '#90a890',
  'brand-3': '#c04830',
  'brand-4': '#d89030',
  'brand-5': '#f0d890',
}

RGB Array

[72, 48, 24], [144, 168, 144], [192, 72, 48], [216, 144, 48], [240, 216, 144]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This warm-style palette of #483018, #90A890, #C04830, #D89030, #F0D890 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: #483018; --color-2: #90a890; --color-3: #c04830; --color-4: #d89030; --color-5: #f0d890. 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