← Back to Editor

#ED6A12 · #6EADD1 · #F6F7F7 · #03235B · #F2DF10

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 AppData Visualization

Color Details Color Details

#ED6A12

Tangerine · Chocolate · Amber Brown

HEX
#ED6A12
RGB
rgb(237, 106, 18)
HSL
hsl(24, 86%, 50%)
HSB
hsb(24, 92%, 93%)
CMYK
cmyk(0%, 55%, 92%, 7%)
Oklch
oklch(67.5% 0.183 46.6)

Traditional「Tangerine」· Paint「Amber Brown」· Creative Blush Sunrise

#6EADD1

Sky Blue · CornflowerBlue · Cobalt Blue

HEX
#6EADD1
RGB
rgb(110, 173, 209)
HSL
hsl(202, 52%, 63%)
HSB
hsb(202, 47%, 82%)
CMYK
cmyk(47%, 17%, 0%, 18%)
Oklch
oklch(71.9% 0.083 234.7)

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

#F6F7F7

Moonlight White · Snow · Cloud White

HEX
#F6F7F7
RGB
rgb(246, 247, 247)
HSL
hsl(180, 6%, 97%)
HSB
hsb(180, 0%, 97%)
CMYK
cmyk(0%, 0%, 0%, 3%)
Oklch
oklch(97.5% 0.001 197.1)

Traditional「Moonlight White」· Paint「Cloud White」· Creative Morning Mist

#03235B

Indigo · MidnightBlue · Deep Sea Blue

HEX
#03235B
RGB
rgb(3, 35, 91)
HSL
hsl(218, 94%, 18%)
HSB
hsb(218, 97%, 36%)
CMYK
cmyk(97%, 62%, 0%, 64%)
Oklch
oklch(27.5% 0.107 260.5)

Traditional「Indigo」· Paint「Deep Sea Blue」· Creative Blush Sunrise

#F2DF10

Autumn Sage · Gold · Sunflower

HEX
#F2DF10
RGB
rgb(242, 223, 16)
HSL
hsl(55, 90%, 51%)
HSB
hsb(55, 93%, 95%)
CMYK
cmyk(0%, 8%, 93%, 5%)
Oklch
oklch(89.1% 0.186 103.2)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

ED6A12
1295ED

Analogous

ED1228
ED6A12
EDD712

Triadic

ED6A12
12ED6A
6A12ED

Split-Comp.

ED6A12
12EDD7
1228ED

Tetradic

ED6A12
28ED12
1295ED
D712ED

Contrast Matrix WCAG 2.1 Contrast

ED6A12
6EADD1
F6F7F7
03235B
F2DF10
—
1.3
Fail
2.9
Fail
4.8
AA
2.3
Fail
1.3
Fail
—
2.3
Fail
6.1
AA
1.8
Fail
2.9
Fail
2.3
Fail
—
14.0
AAA
1.3
Fail
4.8
AA
6.1
AA
14.0
AAA
—
11.0
AAA
2.3
Fail
1.8
Fail
1.3
Fail
11.0
AAA
—
White BG
3.1AA Large
2.5Fail
1.1Fail
15.0AAA
1.4Fail
Black BG
6.7AA
8.6AAA
19.6AAA
1.4Fail
15.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

B4B327
898AC8
F6F6F7
11114D
EAEA42

Deuteranopia

BCC62C
8681C6
F6F6F7
0F0D4A
EBEC4E

Tritanopia

E6383C
71C1C0
F6F7F7
054340
F16A72

Achromatopsia

878787
9E9E9E
F7F7F7
202020
CDCDCD

Shades & Tints Shades & Tints

#ED6A12

Dark
Light

#6EADD1

Dark
Light

#F6F7F7

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ed6a12;
  --color-2: #6eadd1;
  --color-3: #f6f7f7;
  --color-4: #03235b;
  --color-5: #f2df10;
}

SCSS

$color-1: #ed6a12;
$color-2: #6eadd1;
$color-3: #f6f7f7;
$color-4: #03235b;
$color-5: #f2df10;

TAILWIND

colors: {
  'brand-1': '#ed6a12',
  'brand-2': '#6eadd1',
  'brand-3': '#f6f7f7',
  'brand-4': '#03235b',
  'brand-5': '#f2df10',
}

RGB Array

[237, 106, 18], [110, 173, 209], [246, 247, 247], [3, 35, 91], [242, 223, 16]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This warm-style palette of #ED6A12, #6EADD1, #F6F7F7, #03235B, #F2DF10 is ideal for: social media posters, mobile apps, e-commerce promos, infographics, data visualization, accessible design. Vivid colors effectively attract user attention. High contrast ensures clear visual hierarchy and readability. 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: #ed6a12; --color-2: #6eadd1; --color-3: #f6f7f7; --color-4: #03235b; --color-5: #f2df10. 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 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