← Back to Editor

#AB835F · #E98F84 · #FFDBB3 · #F8F8B8 · #FFCDB1

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

#AB835F

Tangerine · Gray · Warm Sun

HEX
#AB835F
RGB
rgb(171, 131, 95)
HSL
hsl(28, 31%, 52%)
HSB
hsb(28, 44%, 67%)
CMYK
cmyk(0%, 23%, 44%, 33%)
Oklch
oklch(64.0% 0.070 63.0)

Traditional「Tangerine」· Paint「Warm Sun」· Creative Blush Sunrise

#E98F84

Peach Pink · DarkSalmon · Coral Red

HEX
#E98F84
RGB
rgb(233, 143, 132)
HSL
hsl(7, 70%, 72%)
HSB
hsb(7, 43%, 91%)
CMYK
cmyk(0%, 39%, 43%, 9%)
Oklch
oklch(74.1% 0.111 27.5)

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

#FFDBB3

Goose Yellow · Wheat · Peach Orange

HEX
#FFDBB3
RGB
rgb(255, 219, 179)
HSL
hsl(32, 100%, 85%)
HSB
hsb(32, 30%, 100%)
CMYK
cmyk(0%, 14%, 30%, 0%)
Oklch
oklch(91.2% 0.066 69.8)

Traditional「Goose Yellow」· Paint「Peach Orange」· Creative Honey Glow

#F8F8B8

Fresh Green · Bisque · Lemon Cream

HEX
#F8F8B8
RGB
rgb(248, 248, 184)
HSL
hsl(60, 82%, 85%)
HSB
hsb(60, 26%, 97%)
CMYK
cmyk(0%, 0%, 26%, 3%)
Oklch
oklch(96.4% 0.082 107.8)

Traditional「Fresh Green」· Paint「Lemon Cream」· Creative Lemon Fizz

#FFCDB1

Apricot · Wheat · Peach Orange

HEX
#FFCDB1
RGB
rgb(255, 205, 177)
HSL
hsl(22, 100%, 85%)
HSB
hsb(22, 31%, 100%)
CMYK
cmyk(0%, 20%, 31%, 0%)
Oklch
oklch(88.5% 0.068 50.7)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

AB835F
5F87AB

Analogous

AB5F61
AB835F
ABA85F

Triadic

AB835F
5FAB82
825FAB

Split-Comp.

AB835F
5FABA8
5F61AB

Tetradic

AB835F
61AB5F
5F87AB
A85FAB

Contrast Matrix WCAG 2.1 Contrast

AB835F
E98F84
FFDBB3
F8F8B8
FFCDB1
—
1.4
Fail
2.6
Fail
3.1
AA Large
2.4
Fail
1.4
Fail
—
1.8
Fail
2.2
Fail
1.7
Fail
2.6
Fail
1.8
Fail
—
1.2
Fail
1.1
Fail
3.1
AA Large
2.2
Fail
1.2
Fail
—
1.3
Fail
2.4
Fail
1.7
Fail
1.1
Fail
1.3
Fail
—
White BG
3.4AA Large
2.4Fail
1.3Fail
1.1Fail
1.4Fail
Black BG
6.1AA
8.7AAA
16.0AAA
19.1AAA
14.6AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

9A9968
C2C187
EFEFBD
F8F8C7
E9E9B8

Deuteranopia

9C9F6A
C7CE87
F2F4BF
F8F8CB
ECF0B9

Tritanopia

A96F70
E58989
FDC4C6
F8D4D6
FDBDBE

Achromatopsia

8B8B8B
A9A9A9
E1E1E1
F1F1F1
D9D9D9

Shades & Tints Shades & Tints

#AB835F

Dark
Light

#E98F84

Dark
Light

#FFDBB3

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ab835f;
  --color-2: #e98f84;
  --color-3: #ffdbb3;
  --color-4: #f8f8b8;
  --color-5: #ffcdb1;
}

SCSS

$color-1: #ab835f;
$color-2: #e98f84;
$color-3: #ffdbb3;
$color-4: #f8f8b8;
$color-5: #ffcdb1;

TAILWIND

colors: {
  'brand-1': '#ab835f',
  'brand-2': '#e98f84',
  'brand-3': '#ffdbb3',
  'brand-4': '#f8f8b8',
  'brand-5': '#ffcdb1',
}

RGB Array

[171, 131, 95], [233, 143, 132], [255, 219, 179], [248, 248, 184], [255, 205, 177]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This nature-style palette of #AB835F, #E98F84, #FFDBB3, #F8F8B8, #FFCDB1 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: #ab835f; --color-2: #e98f84; --color-3: #ffdbb3; --color-4: #f8f8b8; --color-5: #ffcdb1. 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