← Back to Editor

#F3036E · #FFBA06 · #C0C99E · #64D3A9 · #32B098

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

#F3036E

Dark Violet · DeepPink · Camellia

HEX
#F3036E
RGB
rgb(243, 3, 110)
HSL
hsl(333, 98%, 48%)
HSB
hsb(333, 99%, 95%)
CMYK
cmyk(0%, 99%, 55%, 5%)
Oklch
oklch(62.0% 0.248 6.4)

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

#FFBA06

Ginger · Orange · Sunflower

HEX
#FFBA06
RGB
rgb(255, 186, 6)
HSL
hsl(43, 100%, 51%)
HSB
hsb(43, 98%, 100%)
CMYK
cmyk(0%, 27%, 98%, 0%)
Oklch
oklch(83.1% 0.171 81.4)

Traditional「Ginger」· Paint「Sunflower」· Creative Blush Sunrise

#C0C99E

Willow Green · Tan · Apple Green

HEX
#C0C99E
RGB
rgb(192, 201, 158)
HSL
hsl(73, 28%, 70%)
HSB
hsb(73, 21%, 79%)
CMYK
cmyk(4%, 0%, 21%, 21%)
Oklch
oklch(81.8% 0.059 117.3)

Traditional「Willow Green」· Paint「Apple Green」· Creative Mint Breeze

#64D3A9

Jade · MediumAquaMarine · Apple Green

HEX
#64D3A9
RGB
rgb(100, 211, 169)
HSL
hsl(157, 56%, 61%)
HSB
hsb(157, 53%, 83%)
CMYK
cmyk(53%, 0%, 20%, 17%)
Oklch
oklch(79.0% 0.120 166.1)

Traditional「Jade」· Paint「Apple Green」· Creative Arctic Pool

#32B098

Mineral Blue · LightSeaGreen · Mint Ice

HEX
#32B098
RGB
rgb(50, 176, 152)
HSL
hsl(169, 56%, 44%)
HSB
hsb(169, 72%, 69%)
CMYK
cmyk(72%, 0%, 14%, 31%)
Oklch
oklch(68.4% 0.113 177.0)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F3036E
02F286

Analogous

F202E6
F3036E
F20E02

Triadic

F3036E
6EF202
026EF2

Split-Comp.

F3036E
02F20E
02E6F2

Tetradic

F3036E
E6F202
02F286
0E02F2

Contrast Matrix WCAG 2.1 Contrast

F3036E
FFBA06
C0C99E
64D3A9
32B098
—
2.4
Fail
2.4
Fail
2.3
Fail
1.5
Fail
2.4
Fail
—
1.0
Fail
1.1
Fail
1.6
Fail
2.4
Fail
1.0
Fail
—
1.1
Fail
1.6
Fail
2.3
Fail
1.1
Fail
1.1
Fail
—
1.5
Fail
1.5
Fail
1.6
Fail
1.6
Fail
1.5
Fail
—
White BG
4.2AA Large
1.7Fail
1.7Fail
1.8Fail
2.7Fail
Black BG
5.0AA
12.3AAA
12.1AAA
11.4AAA
7.8AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

8B8954
E1E132
C4C4A8
9495B3
696A9E

Deuteranopia

99AB4E
E5EA3C
C3C3AB
8E85B6
61589F

Tritanopia

E7403B
FC545C
C0B1B2
6ABBBD
38A2A3

Achromatopsia

575757
BABABA
C1C1C1
ADADAD
888888

Shades & Tints Shades & Tints

#F3036E

Dark
Light

#FFBA06

Dark
Light

#C0C99E

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f3036e;
  --color-2: #ffba06;
  --color-3: #c0c99e;
  --color-4: #64d3a9;
  --color-5: #32b098;
}

SCSS

$color-1: #f3036e;
$color-2: #ffba06;
$color-3: #c0c99e;
$color-4: #64d3a9;
$color-5: #32b098;

TAILWIND

colors: {
  'brand-1': '#f3036e',
  'brand-2': '#ffba06',
  'brand-3': '#c0c99e',
  'brand-4': '#64d3a9',
  'brand-5': '#32b098',
}

RGB Array

[243, 3, 110], [255, 186, 6], [192, 201, 158], [100, 211, 169], [50, 176, 152]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This warm-style palette of #F3036E, #FFBA06, #C0C99E, #64D3A9, #32B098 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: #f3036e; --color-2: #ffba06; --color-3: #c0c99e; --color-4: #64d3a9; --color-5: #32b098. 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