← Back to Editor

#AAB887 · #E2C18B · #FFA18D · #F36B7F · #DD637A

nature

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

VibrantFreshWarm

Industry INDUSTRY

EcoWellnessOutdoor

UI Context UI CONTEXT

Landing PageMobile App

Color Details Color Details

#AAB887

Willow Green · DarkSeaGreen · Apple Green

HEX
#AAB887
RGB
rgb(170, 184, 135)
HSL
hsl(77, 26%, 63%)
HSB
hsb(77, 27%, 72%)
CMYK
cmyk(8%, 0%, 27%, 28%)
Oklch
oklch(75.9% 0.069 121.0)

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

#E2C18B

Goose Yellow · BurlyWood · Warm Sun

HEX
#E2C18B
RGB
rgb(226, 193, 139)
HSL
hsl(37, 60%, 72%)
HSB
hsb(37, 38%, 89%)
CMYK
cmyk(0%, 15%, 38%, 11%)
Oklch
oklch(82.7% 0.080 79.6)

Traditional「Goose Yellow」· Paint「Warm Sun」· Creative Honey Glow

#FFA18D

Peach Pink · LightSalmon · Coral Red

HEX
#FFA18D
RGB
rgb(255, 161, 141)
HSL
hsl(11, 100%, 78%)
HSB
hsb(11, 45%, 100%)
CMYK
cmyk(0%, 37%, 45%, 0%)
Oklch
oklch(79.9% 0.116 32.7)

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

#F36B7F

Peach Pink · LightCoral · Coral Red

HEX
#F36B7F
RGB
rgb(243, 107, 127)
HSL
hsl(351, 85%, 69%)
HSB
hsb(351, 56%, 95%)
CMYK
cmyk(0%, 56%, 48%, 5%)
Oklch
oklch(69.9% 0.168 13.5)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Rose Petal

#DD637A

Peach Pink · LightCoral · Coral Red

HEX
#DD637A
RGB
rgb(221, 99, 122)
HSL
hsl(349, 64%, 63%)
HSB
hsb(349, 55%, 87%)
CMYK
cmyk(0%, 55%, 45%, 13%)
Oklch
oklch(65.5% 0.154 10.6)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Rose Petal

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

AAB887
9688B9

Analogous

B9AF88
AAB887
93B988

Triadic

AAB887
88ABB9
B988AB

Split-Comp.

AAB887
8893B9
AF88B9

Tetradic

AAB887
88B9AF
9688B9
B98893

Contrast Matrix WCAG 2.1 Contrast

AAB887
E2C18B
FFA18D
F36B7F
DD637A
—
1.2
Fail
1.1
Fail
1.4
Fail
1.6
Fail
1.2
Fail
—
1.1
Fail
1.7
Fail
2.0
Fail
1.1
Fail
1.1
Fail
—
1.5
Fail
1.7
Fail
1.4
Fail
1.7
Fail
1.5
Fail
—
1.2
Fail
1.6
Fail
2.0
Fail
1.7
Fail
1.2
Fail
—
White BG
2.1Fail
1.7Fail
2.0Fail
2.9Fail
3.4AA Large
Black BG
9.9AAA
12.2AAA
10.7AAA
7.2AAA
6.1AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

B0B093
D4D398
D6D592
B8B77A
A8A774

Deuteranopia

AFAE96
D6D89B
DCE393
C0CA79
AFB873

Tritanopia

AB9C9E
E0A2A5
FA9697
EC7676
D7706F

Achromatopsia

AEAEAE
C5C5C5
BBBBBB
969696
8A8A8A

Shades & Tints Shades & Tints

#AAB887

Dark
Light

#E2C18B

Dark
Light

#FFA18D

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #aab887;
  --color-2: #e2c18b;
  --color-3: #ffa18d;
  --color-4: #f36b7f;
  --color-5: #dd637a;
}

SCSS

$color-1: #aab887;
$color-2: #e2c18b;
$color-3: #ffa18d;
$color-4: #f36b7f;
$color-5: #dd637a;

TAILWIND

colors: {
  'brand-1': '#aab887',
  'brand-2': '#e2c18b',
  'brand-3': '#ffa18d',
  'brand-4': '#f36b7f',
  'brand-5': '#dd637a',
}

RGB Array

[170, 184, 135], [226, 193, 139], [255, 161, 141], [243, 107, 127], [221, 99, 122]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This nature-style palette of #AAB887, #E2C18B, #FFA18D, #F36B7F, #DD637A is ideal for: social media posters, mobile apps, e-commerce promos, health products, baby brands, fresh-style blogs. 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: #aab887; --color-2: #e2c18b; --color-3: #ffa18d; --color-4: #f36b7f; --color-5: #dd637a. 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?

Light tones suit backgrounds; use dark colors for body text. Mid-tones work for card backgrounds or dividers to add depth. 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