← Back to Editor

#28858A · #FAB22A · #EF872E · #E3523F · #9E3D46

warm

A 5-color warm palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicWarmCool

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial App

Color Details Color Details

#28858A

Lake Blue · Teal · Mint Ice

HEX
#28858A
RGB
rgb(40, 133, 138)
HSL
hsl(183, 55%, 35%)
HSB
hsb(183, 71%, 54%)
CMYK
cmyk(71%, 4%, 0%, 46%)
Oklch
oklch(56.6% 0.084 200.3)

Traditional「Lake Blue」· Paint「Mint Ice」· Creative Blush Sunrise

#FAB22A

Ginger · GoldenRod · Warm Sun

HEX
#FAB22A
RGB
rgb(250, 178, 42)
HSL
hsl(39, 95%, 57%)
HSB
hsb(39, 83%, 98%)
CMYK
cmyk(0%, 29%, 83%, 2%)
Oklch
oklch(81.2% 0.159 77.3)

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

#EF872E

Tangerine · Coral · Warm Sun

HEX
#EF872E
RGB
rgb(239, 135, 46)
HSL
hsl(28, 86%, 56%)
HSB
hsb(28, 81%, 94%)
CMYK
cmyk(0%, 44%, 81%, 6%)
Oklch
oklch(72.3% 0.159 55.9)

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

#E3523F

Vermilion · Tomato · Passion Red

HEX
#E3523F
RGB
rgb(227, 82, 63)
HSL
hsl(7, 75%, 57%)
HSB
hsb(7, 72%, 89%)
CMYK
cmyk(0%, 64%, 72%, 11%)
Oklch
oklch(63.1% 0.184 30.4)

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

#9E3D46

Crimson · Sienna · Passion Red

HEX
#9E3D46
RGB
rgb(158, 61, 70)
HSL
hsl(354, 44%, 43%)
HSB
hsb(354, 61%, 62%)
CMYK
cmyk(0%, 61%, 56%, 38%)
Oklch
oklch(49.6% 0.129 17.6)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

28858A
8A2D28

Analogous

288A5E
28858A
28548A

Triadic

28858A
8A2885
858A28

Split-Comp.

28858A
8A2854
8A5E28

Tetradic

28858A
5E288A
8A2D28
548A28

Contrast Matrix WCAG 2.1 Contrast

28858A
FAB22A
EF872E
E3523F
9E3D46
—
2.4
Fail
1.7
Fail
1.2
Fail
1.5
Fail
2.4
Fail
—
1.4
Fail
2.1
Fail
3.6
AA Large
1.7
Fail
1.4
Fail
—
1.5
Fail
2.5
Fail
1.2
Fail
2.1
Fail
1.5
Fail
—
1.7
Fail
1.5
Fail
3.6
AA Large
2.5
Fail
1.7
Fail
—
White BG
4.4AA Large
1.8Fail
2.6Fail
3.8AA Large
6.5AA
Black BG
4.8AA
11.5AAA
8.2AAA
5.5AA
3.2AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

505189
DBDA4B
C2C144
A4A344
747344

Deuteranopia

4B4489
DFE453
C8D049
ADB745
7A8143

Tritanopia

2D8888
F6656B
EA5558
DC4748
994242

Achromatopsia

6A6A6A
B8B8B8
9C9C9C
7B7B7B
5B5B5B

Shades & Tints Shades & Tints

#28858A

Dark
Light

#FAB22A

Dark
Light

#EF872E

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #28858a;
  --color-2: #fab22a;
  --color-3: #ef872e;
  --color-4: #e3523f;
  --color-5: #9e3d46;
}

SCSS

$color-1: #28858a;
$color-2: #fab22a;
$color-3: #ef872e;
$color-4: #e3523f;
$color-5: #9e3d46;

TAILWIND

colors: {
  'brand-1': '#28858a',
  'brand-2': '#fab22a',
  'brand-3': '#ef872e',
  'brand-4': '#e3523f',
  'brand-5': '#9e3d46',
}

RGB Array

[40, 133, 138], [250, 178, 42], [239, 135, 46], [227, 82, 63], [158, 61, 70]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This warm-style palette of #28858A, #FAB22A, #EF872E, #E3523F, #9E3D46 is ideal for: social media posters, mobile apps, e-commerce promos. Vivid colors effectively attract user attention. It is a vibrant and energetic choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #28858a; --color-2: #fab22a; --color-3: #ef872e; --color-4: #e3523f; --color-5: #9e3d46. 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 food & dining, entertainment, kids education, social industries. Bold colors convey vitality and innovation. 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