← Back to Editor

#FE958F · #F3D7C2 · #8BB6A3 · #17A7A8 · #122F51

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

Color Details Color Details

#FE958F

Peach Pink · LightSalmon · Coral Red

HEX
#FE958F
RGB
rgb(254, 149, 143)
HSL
hsl(3, 98%, 78%)
HSB
hsb(3, 44%, 100%)
CMYK
cmyk(0%, 41%, 44%, 0%)
Oklch
oklch(77.9% 0.127 23.9)

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

#F3D7C2

Apricot · Wheat · Peach Orange

HEX
#F3D7C2
RGB
rgb(243, 215, 194)
HSL
hsl(26, 67%, 86%)
HSB
hsb(26, 20%, 95%)
CMYK
cmyk(0%, 12%, 20%, 5%)
Oklch
oklch(89.7% 0.042 59.1)

Traditional「Apricot」· Paint「Peach Orange」· Creative Honey Glow

#8BB6A3

Jade · DarkSeaGreen · Apple Green

HEX
#8BB6A3
RGB
rgb(139, 182, 163)
HSL
hsl(153, 23%, 63%)
HSB
hsb(153, 24%, 71%)
CMYK
cmyk(24%, 0%, 10%, 29%)
Oklch
oklch(74.0% 0.054 166.1)

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

#17A7A8

Lake Blue · LightSeaGreen · Mint Ice

HEX
#17A7A8
RGB
rgb(23, 167, 168)
HSL
hsl(180, 76%, 37%)
HSB
hsb(180, 86%, 66%)
CMYK
cmyk(86%, 1%, 0%, 34%)
Oklch
oklch(66.2% 0.109 195.6)

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

#122F51

Indigo · MidnightBlue · Deep Sea Blue

HEX
#122F51
RGB
rgb(18, 47, 81)
HSL
hsl(212, 64%, 19%)
HSB
hsb(212, 78%, 32%)
CMYK
cmyk(78%, 42%, 0%, 68%)
Oklch
oklch(30.2% 0.071 254.2)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FE958F
90F8FE

Analogous

FE90C1
FE958F
FECC90

Triadic

FE958F
90FE95
9590FE

Split-Comp.

FE958F
90FECC
90C1FE

Tetradic

FE958F
C1FE90
90F8FE
CC90FE

Contrast Matrix WCAG 2.1 Contrast

FE958F
F3D7C2
8BB6A3
17A7A8
122F51
—
1.5
Fail
1.1
Fail
1.4
Fail
6.4
AA
1.5
Fail
—
1.6
Fail
2.1
Fail
9.9
AAA
1.1
Fail
1.6
Fail
—
1.3
Fail
6.0
AA
1.4
Fail
2.1
Fail
1.3
Fail
—
4.6
AA
6.4
AA
9.9
AAA
6.0
AA
4.6
AA
—
White BG
2.1Fail
1.4Fail
2.3Fail
2.9Fail
13.5AAA
Black BG
9.9AAA
15.3AAA
9.3AAA
7.1AAA
1.6Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

D1D090
E7E7C7
9E9EA8
5557A8
1F1F49

Deuteranopia

D7DE91
E9EBC8
9B98A9
4D42A8
1D1B47

Tritanopia

F99292
F2CBCC
8DABAC
1EA8A8
134241

Achromatopsia

B4B4B4
DDDDDD
A7A7A7
7C7C7C
2A2A2A

Shades & Tints Shades & Tints

#FE958F

Dark
Light

#F3D7C2

Dark
Light

#8BB6A3

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #fe958f;
  --color-2: #f3d7c2;
  --color-3: #8bb6a3;
  --color-4: #17a7a8;
  --color-5: #122f51;
}

SCSS

$color-1: #fe958f;
$color-2: #f3d7c2;
$color-3: #8bb6a3;
$color-4: #17a7a8;
$color-5: #122f51;

TAILWIND

colors: {
  'brand-1': '#fe958f',
  'brand-2': '#f3d7c2',
  'brand-3': '#8bb6a3',
  'brand-4': '#17a7a8',
  'brand-5': '#122f51',
}

RGB Array

[254, 149, 143], [243, 215, 194], [139, 182, 163], [23, 167, 168], [18, 47, 81]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This nature-style palette of #FE958F, #F3D7C2, #8BB6A3, #17A7A8, #122F51 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: #fe958f; --color-2: #f3d7c2; --color-3: #8bb6a3; --color-4: #17a7a8; --color-5: #122f51. 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 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