← Back to Editor

#F75F52 · #F0D9A1 · #85CCA0 · #5AA698 · #1C414F

nature

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

CalmOrganicGroundedWarmCool

Industry INDUSTRY

EcoWellnessOutdoor

UI Context UI CONTEXT

Brand WebsiteBlogData Visualization

Color Details Color Details

#F75F52

Peach Pink · Tomato · Coral Red

HEX
#F75F52
RGB
rgb(247, 95, 82)
HSL
hsl(5, 91%, 65%)
HSB
hsb(5, 67%, 97%)
CMYK
cmyk(0%, 62%, 67%, 3%)
Oklch
oklch(68.1% 0.189 28.0)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

#F0D9A1

Goose Yellow · Wheat · Lemon Cream

HEX
#F0D9A1
RGB
rgb(240, 217, 161)
HSL
hsl(43, 72%, 79%)
HSB
hsb(43, 33%, 94%)
CMYK
cmyk(0%, 10%, 33%, 6%)
Oklch
oklch(89.1% 0.076 88.3)

Traditional「Goose Yellow」· Paint「Lemon Cream」· Creative Lemon Fizz

#85CCA0

Celadon · DarkSeaGreen · Apple Green

HEX
#85CCA0
RGB
rgb(133, 204, 160)
HSL
hsl(143, 41%, 66%)
HSB
hsb(143, 35%, 80%)
CMYK
cmyk(35%, 0%, 22%, 20%)
Oklch
oklch(78.6% 0.095 156.2)

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

#5AA698

Mineral Blue · CadetBlue · Mint Ice

HEX
#5AA698
RGB
rgb(90, 166, 152)
HSL
hsl(169, 30%, 50%)
HSB
hsb(169, 46%, 65%)
CMYK
cmyk(46%, 0%, 8%, 35%)
Oklch
oklch(67.2% 0.079 180.5)

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

#1C414F

Slate Blue · DarkSlateGray · Peacock Green

HEX
#1C414F
RGB
rgb(28, 65, 79)
HSL
hsl(196, 48%, 21%)
HSB
hsb(196, 65%, 31%)
CMYK
cmyk(65%, 18%, 0%, 69%)
Oklch
oklch(35.5% 0.049 225.5)

Traditional「Slate Blue」· Paint「Peacock Green」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F75F52
55E9F7

Analogous

F75598
F75F52
F7B355

Triadic

F75F52
55F762
6255F7

Split-Comp.

F75F52
55F7B3
5598F7

Tetradic

F75F52
98F755
55E9F7
B355F7

Contrast Matrix WCAG 2.1 Contrast

F75F52
F0D9A1
85CCA0
5AA698
1C414F
—
2.3
Fail
1.7
Fail
1.1
Fail
3.5
AA Large
2.3
Fail
—
1.4
Fail
2.1
Fail
7.9
AAA
1.7
Fail
1.4
Fail
—
1.5
Fail
5.8
AA
1.1
Fail
2.1
Fail
1.5
Fail
—
3.8
AA Large
3.5
AA Large
7.9
AAA
5.8
AA
3.8
AA Large
—
White BG
3.1AA Large
1.4Fail
1.9Fail
2.9Fail
10.9AAA
Black BG
6.7AA
15.1AAA
11.1AAA
7.3AAA
1.9Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

B5B455
E6E6AF
A4A4AB
7B7C9B
2C2C4C

Deuteranopia

BEC956
E7E9B2
A09AAD
77719C
2A274B

Tritanopia

EF5858
EFB9BC
89B3B5
5E9E9F
1E4948

Achromatopsia

8B8B8B
D9D9D9
B2B2B2
8E8E8E
383838

Shades & Tints Shades & Tints

#F75F52

Dark
Light

#F0D9A1

Dark
Light

#85CCA0

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f75f52;
  --color-2: #f0d9a1;
  --color-3: #85cca0;
  --color-4: #5aa698;
  --color-5: #1c414f;
}

SCSS

$color-1: #f75f52;
$color-2: #f0d9a1;
$color-3: #85cca0;
$color-4: #5aa698;
$color-5: #1c414f;

TAILWIND

colors: {
  'brand-1': '#f75f52',
  'brand-2': '#f0d9a1',
  'brand-3': '#85cca0',
  'brand-4': '#5aa698',
  'brand-5': '#1c414f',
}

RGB Array

[247, 95, 82], [240, 217, 161], [133, 204, 160], [90, 166, 152], [28, 65, 79]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This nature-style palette of #F75F52, #F0D9A1, #85CCA0, #5AA698, #1C414F 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: #f75f52; --color-2: #f0d9a1; --color-3: #85cca0; --color-4: #5aa698; --color-5: #1c414f. 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 nature-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