← Back to Editor

#A2A56C · #D45033 · #B10C43 · #9A0C0C · #FFD8AD

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

#A2A56C

Autumn Sage · DarkSeaGreen · Sunflower

HEX
#A2A56C
RGB
rgb(162, 165, 108)
HSL
hsl(63, 24%, 54%)
HSB
hsb(63, 35%, 65%)
CMYK
cmyk(2%, 0%, 35%, 35%)
Oklch
oklch(70.6% 0.077 110.8)

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

#D45033

Vermilion · Chocolate · Passion Red

HEX
#D45033
RGB
rgb(212, 80, 51)
HSL
hsl(11, 65%, 52%)
HSB
hsb(11, 76%, 83%)
CMYK
cmyk(0%, 62%, 76%, 17%)
Oklch
oklch(60.4% 0.172 34.0)

Traditional「Vermilion」· Paint「Passion Red」· Creative Blush Sunrise

#B10C43

Dark Violet · FireBrick · Camellia

HEX
#B10C43
RGB
rgb(177, 12, 67)
HSL
hsl(340, 87%, 37%)
HSB
hsb(340, 93%, 69%)
CMYK
cmyk(0%, 93%, 62%, 31%)
Oklch
oklch(48.9% 0.190 11.8)

Traditional「Dark Violet」· Paint「Camellia」· Creative Blush Sunrise

#9A0C0C

Vermilion · DarkRed · Wine Red

HEX
#9A0C0C
RGB
rgb(154, 12, 12)
HSL
hsl(0, 86%, 33%)
HSB
hsb(0, 92%, 60%)
CMYK
cmyk(0%, 92%, 92%, 40%)
Oklch
oklch(43.6% 0.172 28.4)

Traditional「Vermilion」· Paint「Wine Red」· Creative Blush Sunrise

#FFD8AD

Goose Yellow · Wheat · Peach Orange

HEX
#FFD8AD
RGB
rgb(255, 216, 173)
HSL
hsl(31, 100%, 84%)
HSB
hsb(31, 32%, 100%)
CMYK
cmyk(0%, 15%, 32%, 0%)
Oklch
oklch(90.5% 0.071 69.5)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

A2A56C
706EA6

Analogous

A68D6E
A2A56C
87A66E

Triadic

A2A56C
6EA3A6
A66EA3

Split-Comp.

A2A56C
6E87A6
8D6EA6

Tetradic

A2A56C
6EA68D
706EA6
A66E87

Contrast Matrix WCAG 2.1 Contrast

A2A56C
D45033
B10C43
9A0C0C
FFD8AD
—
1.6
Fail
2.7
Fail
3.3
AA Large
1.9
Fail
1.6
Fail
—
1.7
Fail
2.1
Fail
3.1
AA Large
2.7
Fail
1.7
Fail
—
1.2
Fail
5.2
AA
3.3
AA Large
2.1
Fail
1.2
Fail
—
6.4
AA
1.9
Fail
3.1
AA Large
5.2
AA
6.4
AA
—
White BG
2.6Fail
4.2AA Large
7.0AA
8.6AAA
1.3Fail
Black BG
8.1AAA
5.0AA
3.0AA Large
2.4Fail
15.7AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

A3A37A
9B9A3A
6A6836
5D5B0C
EEEEB7

Deuteranopia

A3A37D
A3AC3C
737F33
656F0C
F0F3BA

Tritanopia

A28587
CD4041
A92B29
930C0C
FDC0C1

Achromatopsia

9E9E9E
747474
444444
363636
DFDFDF

Shades & Tints Shades & Tints

#A2A56C

Dark
Light

#D45033

Dark
Light

#B10C43

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #a2a56c;
  --color-2: #d45033;
  --color-3: #b10c43;
  --color-4: #9a0c0c;
  --color-5: #ffd8ad;
}

SCSS

$color-1: #a2a56c;
$color-2: #d45033;
$color-3: #b10c43;
$color-4: #9a0c0c;
$color-5: #ffd8ad;

TAILWIND

colors: {
  'brand-1': '#a2a56c',
  'brand-2': '#d45033',
  'brand-3': '#b10c43',
  'brand-4': '#9a0c0c',
  'brand-5': '#ffd8ad',
}

RGB Array

[162, 165, 108], [212, 80, 51], [177, 12, 67], [154, 12, 12], [255, 216, 173]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This nature-style palette of #A2A56C, #D45033, #B10C43, #9A0C0C, #FFD8AD 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: #a2a56c; --color-2: #d45033; --color-3: #b10c43; --color-4: #9a0c0c; --color-5: #ffd8ad. 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