← Back to Editor

#FFF5E6 · #FBDCE1 · #F7CBDE · #CDBDDE · #99B8C7

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

#FFF5E6

Goose Yellow · Linen · Peach Orange

HEX
#FFF5E6
RGB
rgb(255, 245, 230)
HSL
hsl(36, 100%, 95%)
HSB
hsb(36, 10%, 100%)
CMYK
cmyk(0%, 4%, 10%, 0%)
Oklch
oklch(97.4% 0.023 78.2)

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

#FBDCE1

Peach Pink · Linen · Cherry Blossom

HEX
#FBDCE1
RGB
rgb(251, 220, 225)
HSL
hsl(350, 79%, 92%)
HSB
hsb(350, 12%, 98%)
CMYK
cmyk(0%, 12%, 10%, 2%)
Oklch
oklch(92.1% 0.035 6.8)

Traditional「Peach Pink」· Paint「Cherry Blossom」· Creative Rose Petal

#F7CBDE

Rouge · Pink · Cherry Blossom

HEX
#F7CBDE
RGB
rgb(247, 203, 222)
HSL
hsl(334, 73%, 88%)
HSB
hsb(334, 18%, 97%)
CMYK
cmyk(0%, 18%, 10%, 3%)
Oklch
oklch(88.5% 0.055 350.5)

Traditional「Rouge」· Paint「Cherry Blossom」· Creative Rose Petal

#CDBDDE

Wisteria · LightGray · Lavender

HEX
#CDBDDE
RGB
rgb(205, 189, 222)
HSL
hsl(269, 33%, 81%)
HSB
hsb(269, 15%, 87%)
CMYK
cmyk(8%, 15%, 0%, 13%)
Oklch
oklch(82.2% 0.049 307.2)

Traditional「Wisteria」· Paint「Lavender」· Creative Lavender Dream

#99B8C7

Sky Blue · LightSteelBlue · Cobalt Blue

HEX
#99B8C7
RGB
rgb(153, 184, 199)
HSL
hsl(200, 29%, 69%)
HSB
hsb(200, 23%, 78%)
CMYK
cmyk(23%, 8%, 0%, 22%)
Oklch
oklch(76.4% 0.040 228.7)

Traditional「Sky Blue」· Paint「Cobalt Blue」· Creative Twilight Haze

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FFF5E6
E5F0FF

Analogous

FFE8E5
FFF5E6
FCFFE5

Triadic

FFF5E6
E5FFF5
F5E5FF

Split-Comp.

FFF5E6
E5FCFF
E8E5FF

Tetradic

FFF5E6
E5FFE8
E5F0FF
FFE5FC

Contrast Matrix WCAG 2.1 Contrast

FFF5E6
FBDCE1
F7CBDE
CDBDDE
99B8C7
—
1.2
Fail
1.3
Fail
1.6
Fail
1.9
Fail
1.2
Fail
—
1.1
Fail
1.4
Fail
1.6
Fail
1.3
Fail
1.1
Fail
—
1.2
Fail
1.5
Fail
1.6
Fail
1.4
Fail
1.2
Fail
—
1.2
Fail
1.9
Fail
1.6
Fail
1.5
Fail
1.2
Fail
—
White BG
1.1Fail
1.3Fail
1.4Fail
1.8Fail
2.1Fail
Black BG
19.5AAA
16.4AAA
14.6AAA
11.9AAA
10.0AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

FBFBEA
EEEDE0
E4E4D9
C6C6D6
A6A7C3

Deuteranopia

FBFCEB
EFF2E0
E7EAD8
C7C8D4
A5A2C2

Tritanopia

FFECED
F9DFDF
F5D6D5
CCD0CE
9BC1C0

Achromatopsia

F6F6F6
E6E6E6
DADADA
C6C6C6
B0B0B0

Shades & Tints Shades & Tints

#FFF5E6

Dark
Light

#FBDCE1

Dark
Light

#F7CBDE

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #fff5e6;
  --color-2: #fbdce1;
  --color-3: #f7cbde;
  --color-4: #cdbdde;
  --color-5: #99b8c7;
}

SCSS

$color-1: #fff5e6;
$color-2: #fbdce1;
$color-3: #f7cbde;
$color-4: #cdbdde;
$color-5: #99b8c7;

TAILWIND

colors: {
  'brand-1': '#fff5e6',
  'brand-2': '#fbdce1',
  'brand-3': '#f7cbde',
  'brand-4': '#cdbdde',
  'brand-5': '#99b8c7',
}

RGB Array

[255, 245, 230], [251, 220, 225], [247, 203, 222], [205, 189, 222], [153, 184, 199]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This nature-style palette of #FFF5E6, #FBDCE1, #F7CBDE, #CDBDDE, #99B8C7 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: #fff5e6; --color-2: #fbdce1; --color-3: #f7cbde; --color-4: #cdbdde; --color-5: #99b8c7. 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