← Back to Editor

#F17207 · #F92718 · #B90008 · #581A03 · #11735C

nature

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

VibrantFreshWarmCool

Industry INDUSTRY

EcoWellnessOutdoor

UI Context UI CONTEXT

Landing PageMobile App

Color Details Color Details

#F17207

Tangerine · Chocolate · Amber Brown

HEX
#F17207
RGB
rgb(241, 114, 7)
HSL
hsl(27, 94%, 49%)
HSB
hsb(27, 97%, 95%)
CMYK
cmyk(0%, 53%, 97%, 5%)
Oklch
oklch(69.2% 0.182 49.8)

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

#F92718

Vermilion · OrangeRed · Passion Red

HEX
#F92718
RGB
rgb(249, 39, 24)
HSL
hsl(4, 95%, 54%)
HSB
hsb(4, 90%, 98%)
CMYK
cmyk(0%, 84%, 90%, 2%)
Oklch
oklch(62.9% 0.241 29.7)

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

#B90008

Vermilion · FireBrick · Wine Red

HEX
#B90008
RGB
rgb(185, 0, 8)
HSL
hsl(357, 100%, 36%)
HSB
hsb(357, 100%, 73%)
CMYK
cmyk(0%, 100%, 96%, 27%)
Oklch
oklch(49.4% 0.202 28.3)

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

#581A03

Tangerine · Maroon · Cinnamon

HEX
#581A03
RGB
rgb(88, 26, 3)
HSL
hsl(16, 93%, 18%)
HSB
hsb(16, 97%, 35%)
CMYK
cmyk(0%, 70%, 97%, 65%)
Oklch
oklch(31.5% 0.097 38.8)

Traditional「Tangerine」· Paint「Cinnamon」· Creative Blush Sunrise

#11735C

Mineral Blue · SeaGreen · Mint Ice

HEX
#11735C
RGB
rgb(17, 115, 92)
HSL
hsl(166, 74%, 26%)
HSB
hsb(166, 85%, 45%)
CMYK
cmyk(85%, 0%, 20%, 55%)
Oklch
oklch(49.7% 0.092 171.7)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F17207
0789F2

Analogous

F20713
F17207
F2E707

Triadic

F17207
07F271
7107F2

Split-Comp.

F17207
07F2E7
0713F2

Tetradic

F17207
13F207
0789F2
E707F2

Contrast Matrix WCAG 2.1 Contrast

F17207
F92718
B90008
581A03
11735C
—
1.3
Fail
2.3
Fail
4.6
AA
2.0
Fail
1.3
Fail
—
1.7
Fail
3.4
AA Large
1.5
Fail
2.3
Fail
1.7
Fail
—
2.0
Fail
1.2
Fail
4.6
AA
3.4
AA Large
2.0
Fail
—
2.3
Fail
2.0
Fail
1.5
Fail
1.2
Fail
2.3
Fail
—
White BG
2.9Fail
3.9AA Large
6.8AA
13.4AAA
5.8AA
Black BG
7.2AAA
5.3AA
3.1AA Large
1.6Fail
3.6AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

BAB921
9E9C1C
696706
3D3D09
3B3C62

Deuteranopia

C1CB27
AABA1C
748206
41450A
362E63

Tritanopia

EB353A
EE1E1F
B00504
550D0E
166667

Achromatopsia

8C8C8C
646464
383838
2A2A2A
535353

Shades & Tints Shades & Tints

#F17207

Dark
Light

#F92718

Dark
Light

#B90008

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f17207;
  --color-2: #f92718;
  --color-3: #b90008;
  --color-4: #581a03;
  --color-5: #11735c;
}

SCSS

$color-1: #f17207;
$color-2: #f92718;
$color-3: #b90008;
$color-4: #581a03;
$color-5: #11735c;

TAILWIND

colors: {
  'brand-1': '#f17207',
  'brand-2': '#f92718',
  'brand-3': '#b90008',
  'brand-4': '#581a03',
  'brand-5': '#11735c',
}

RGB Array

[241, 114, 7], [249, 39, 24], [185, 0, 8], [88, 26, 3], [17, 115, 92]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This nature-style palette of #F17207, #F92718, #B90008, #581A03, #11735C is ideal for: social media posters, mobile apps, e-commerce promos, tech websites, dark mode UIs, game UIs. 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: #f17207; --color-2: #f92718; --color-3: #b90008; --color-4: #581a03; --color-5: #11735c. 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?

Dark tones work well as backgrounds; pair with light text for readability. Use the brightest color for CTA buttons and interactive elements. 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 nature-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