← Back to Editor

#BDCD53 · #F5F2E1 · #F0D3D3 · #F7A9B9 · #F86599

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

#BDCD53

Autumn Sage · GreenYellow · Sunflower

HEX
#BDCD53
RGB
rgb(189, 205, 83)
HSL
hsl(68, 55%, 56%)
HSB
hsb(68, 60%, 80%)
CMYK
cmyk(8%, 0%, 60%, 20%)
Oklch
oklch(81.2% 0.147 116.1)

Traditional「Autumn Sage」· Paint「Sunflower」· Creative Blush Sunrise

#F5F2E1

Fresh Green · Beige · Lemon Cream

HEX
#F5F2E1
RGB
rgb(245, 242, 225)
HSL
hsl(51, 50%, 92%)
HSB
hsb(51, 8%, 96%)
CMYK
cmyk(0%, 1%, 8%, 4%)
Oklch
oklch(95.9% 0.023 98.6)

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

#F0D3D3

Peach Pink · Pink · Cherry Blossom

HEX
#F0D3D3
RGB
rgb(240, 211, 211)
HSL
hsl(0, 49%, 88%)
HSB
hsb(0, 12%, 94%)
CMYK
cmyk(0%, 12%, 12%, 6%)
Oklch
oklch(89.1% 0.032 17.8)

Traditional「Peach Pink」· Paint「Cherry Blossom」· Creative Blush Sunrise

#F7A9B9

Peach Pink · LightPink · Cherry Blossom

HEX
#F7A9B9
RGB
rgb(247, 169, 185)
HSL
hsl(348, 83%, 82%)
HSB
hsb(348, 32%, 97%)
CMYK
cmyk(0%, 32%, 25%, 3%)
Oklch
oklch(81.4% 0.094 5.9)

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

#F86599

Rouge · LightCoral · Rose Pink

HEX
#F86599
RGB
rgb(248, 101, 153)
HSL
hsl(339, 91%, 68%)
HSB
hsb(339, 59%, 97%)
CMYK
cmyk(0%, 59%, 38%, 3%)
Oklch
oklch(70.5% 0.186 1.0)

Traditional「Rouge」· Paint「Rose Pink」· Creative Rose Petal

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

BDCD53
6251CD

Analogous

CD9F51
BDCD53
7ECD51

Triadic

BDCD53
51BCCD
CD51BC

Split-Comp.

BDCD53
517ECD
9F51CD

Tetradic

BDCD53
51CD9F
6251CD
CD517E

Contrast Matrix WCAG 2.1 Contrast

BDCD53
F5F2E1
F0D3D3
F7A9B9
F86599
—
1.6
Fail
1.2
Fail
1.1
Fail
1.6
Fail
1.6
Fail
—
1.2
Fail
1.6
Fail
2.6
Fail
1.2
Fail
1.2
Fail
—
1.3
Fail
2.0
Fail
1.1
Fail
1.6
Fail
1.3
Fail
—
1.5
Fail
1.6
Fail
2.6
Fail
2.0
Fail
1.5
Fail
—
White BG
1.7Fail
1.1Fail
1.4Fail
1.9Fail
2.9Fail
Black BG
12.0AAA
18.7AAA
15.0AAA
11.3AAA
7.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

C4C471
F4F4E5
E3E3D3
D5D5B5
B8B78C

Deuteranopia

C3C278
F4F4E6
E5E7D3
DAE0B4
C1CC89

Tritanopia

BE888D
F5E8E9
EFD3D3
F3B2B1
F18280

Achromatopsia

BABABA
F1F1F1
DCDCDC
C2C2C2
979797

Shades & Tints Shades & Tints

#BDCD53

Dark
Light

#F5F2E1

Dark
Light

#F0D3D3

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #bdcd53;
  --color-2: #f5f2e1;
  --color-3: #f0d3d3;
  --color-4: #f7a9b9;
  --color-5: #f86599;
}

SCSS

$color-1: #bdcd53;
$color-2: #f5f2e1;
$color-3: #f0d3d3;
$color-4: #f7a9b9;
$color-5: #f86599;

TAILWIND

colors: {
  'brand-1': '#bdcd53',
  'brand-2': '#f5f2e1',
  'brand-3': '#f0d3d3',
  'brand-4': '#f7a9b9',
  'brand-5': '#f86599',
}

RGB Array

[189, 205, 83], [245, 242, 225], [240, 211, 211], [247, 169, 185], [248, 101, 153]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This nature-style palette of #BDCD53, #F5F2E1, #F0D3D3, #F7A9B9, #F86599 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: #bdcd53; --color-2: #f5f2e1; --color-3: #f0d3d3; --color-4: #f7a9b9; --color-5: #f86599. 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