← Back to Editor

#FF2859 · #FFCB88 · #C9B97B · #710045 · #AB0B4F

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

Color Details Color Details

#FF2859

Vermilion · Crimson · Passion Red

HEX
#FF2859
RGB
rgb(255, 40, 89)
HSL
hsl(346, 100%, 58%)
HSB
hsb(346, 84%, 100%)
CMYK
cmyk(0%, 84%, 65%, 0%)
Oklch
oklch(64.8% 0.241 16.3)

TraditionalVermilion」· PaintPassion Red」· Creative Blush Sunrise

#FFCB88

Goose Yellow · Khaki · Peach Orange

HEX
#FFCB88
RGB
rgb(255, 203, 136)
HSL
hsl(34, 100%, 77%)
HSB
hsb(34, 47%, 100%)
CMYK
cmyk(0%, 20%, 47%, 0%)
Oklch
oklch(87.3% 0.103 72.9)

TraditionalGoose Yellow」· PaintPeach Orange」· Creative Honey Glow

#C9B97B

Ginger · Tan · Sunflower

HEX
#C9B97B
RGB
rgb(201, 185, 123)
HSL
hsl(48, 42%, 64%)
HSB
hsb(48, 39%, 79%)
CMYK
cmyk(0%, 8%, 39%, 21%)
Oklch
oklch(78.5% 0.083 95.4)

TraditionalGinger」· PaintSunflower」· Creative Lemon Fizz

#710045

Rose Purple · Purple · Raspberry

HEX
#710045
RGB
rgb(113, 0, 69)
HSL
hsl(323, 100%, 22%)
HSB
hsb(323, 100%, 44%)
CMYK
cmyk(0%, 100%, 39%, 56%)
Oklch
oklch(36.0% 0.149 352.1)

TraditionalRose Purple」· PaintRaspberry」· Creative Blush Sunrise

#AB0B4F

Dark Violet · Brown · Camellia

HEX
#AB0B4F
RGB
rgb(171, 11, 79)
HSL
hsl(335, 88%, 36%)
HSB
hsb(335, 94%, 67%)
CMYK
cmyk(0%, 94%, 54%, 33%)
Oklch
oklch(48.0% 0.188 5.2)

TraditionalDark Violet」· PaintCamellia」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FF2859
29FFCD

Analogous

FF29C6
FF2859
FF6229

Triadic

FF2859
5BFF29
295BFF

Split-Comp.

FF2859
29FF62
29C6FF

Tetradic

FF2859
C6FF29
29FFCD
6229FF

Contrast Matrix WCAG 2.1 Contrast

FF2859
FFCB88
C9B97B
710045
AB0B4F
2.5
Fail
1.9
Fail
3.2
AA Large
2.0
Fail
2.5
Fail
1.3
Fail
7.9
AAA
4.9
AA
1.9
Fail
1.3
Fail
6.0
AA
3.7
AA Large
3.2
AA Large
7.9
AAA
6.0
AA
1.6
Fail
2.0
Fail
4.9
AA
3.7
AA Large
1.6
Fail
White BG
3.7AA Large
1.5Fail
2.0Fail
11.7AAA
7.3AAA
Black BG
5.7AA
14.1AAA
10.7AAA
1.8Fail
2.9Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

A2A04D
E8E898
C2C28A
403F34
66643F

Deuteranopia

AEBF4A
ECEF9C
C3C48E
474F30
6F7B3B

Tritanopia

F44442
FCA5A8
C89698
6B2724
A3322F

Achromatopsia

6E6E6E
D3D3D3
B7B7B7
2A2A2A
434343

Shades & Tints Shades & Tints

#FF2859

Dark
Light

#FFCB88

Dark
Light

#C9B97B

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ff2859;
  --color-2: #ffcb88;
  --color-3: #c9b97b;
  --color-4: #710045;
  --color-5: #ab0b4f;
}

SCSS

$color-1: #ff2859;
$color-2: #ffcb88;
$color-3: #c9b97b;
$color-4: #710045;
$color-5: #ab0b4f;

TAILWIND

colors: {
  'brand-1': '#ff2859',
  'brand-2': '#ffcb88',
  'brand-3': '#c9b97b',
  'brand-4': '#710045',
  'brand-5': '#ab0b4f',
}

RGB Array

[255, 40, 89], [255, 203, 136], [201, 185, 123], [113, 0, 69], [171, 11, 79]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This nature-style palette of #FF2859, #FFCB88, #C9B97B, #710045, #AB0B4F 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: #ff2859; --color-2: #ffcb88; --color-3: #c9b97b; --color-4: #710045; --color-5: #ab0b4f. 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