← Back to Editor

#B9143C · #371B27 · #ADB68B · #D9CF9A · #F3E6BA

nature

A 5-color nature palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

CalmOrganicGroundedWarm

Industry INDUSTRY

EcoWellnessOutdoor

UI Context UI CONTEXT

Brand WebsiteBlogData Visualization

Color Details Color Details

#B9143C

Vermilion · FireBrick · Wine Red

HEX
#B9143C
RGB
rgb(185, 20, 60)
HSL
hsl(345, 80%, 40%)
HSB
hsb(345, 89%, 73%)
CMYK
cmyk(0%, 89%, 68%, 27%)
Oklch
oklch(50.6% 0.193 16.5)

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

#371B27

Dark Violet · DarkSlateGray · Raspberry

HEX
#371B27
RGB
rgb(55, 27, 39)
HSL
hsl(334, 34%, 16%)
HSB
hsb(334, 51%, 22%)
CMYK
cmyk(0%, 51%, 29%, 78%)
Oklch
oklch(26.5% 0.048 353.7)

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

#ADB68B

Willow Green · DarkSeaGreen · Apple Green

HEX
#ADB68B
RGB
rgb(173, 182, 139)
HSL
hsl(73, 23%, 63%)
HSB
hsb(73, 24%, 71%)
CMYK
cmyk(5%, 0%, 24%, 29%)
Oklch
oklch(75.8% 0.060 117.5)

Traditional「Willow Green」· Paint「Apple Green」· Creative Mint Breeze

#D9CF9A

Fresh Green · BurlyWood · Sunflower

HEX
#D9CF9A
RGB
rgb(217, 207, 154)
HSL
hsl(50, 45%, 73%)
HSB
hsb(50, 29%, 85%)
CMYK
cmyk(0%, 5%, 29%, 15%)
Oklch
oklch(85.0% 0.070 98.7)

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

#F3E6BA

Goose Yellow · Wheat · Lemon Cream

HEX
#F3E6BA
RGB
rgb(243, 230, 186)
HSL
hsl(46, 70%, 84%)
HSB
hsb(46, 23%, 95%)
CMYK
cmyk(0%, 5%, 23%, 5%)
Oklch
oklch(92.4% 0.059 93.5)

Traditional「Goose Yellow」· Paint「Lemon Cream」· Creative Lemon Fizz

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

B9143C
14B88F

Analogous

B8148F
B9143C
B83D14

Triadic

B9143C
3DB814
143DB8

Split-Comp.

B9143C
14B83D
148FB8

Tetradic

B9143C
8FB814
14B88F
3D14B8

Contrast Matrix WCAG 2.1 Contrast

B9143C
371B27
ADB68B
D9CF9A
F3E6BA
—
2.4
Fail
3.0
AA Large
4.1
AA Large
5.2
AA
2.4
Fail
—
7.3
AAA
9.9
AAA
12.5
AAA
3.0
AA Large
7.3
AAA
—
1.4
Fail
1.7
Fail
4.1
AA Large
9.9
AAA
1.4
Fail
—
1.3
Fail
5.2
AA
12.5
AAA
1.7
Fail
1.3
Fail
—
White BG
6.5AA
15.6AAA
2.1Fail
1.6Fail
1.2Fail
Black BG
3.2AA Large
1.3Fail
9.8AAA
13.3AAA
16.8AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

727032
2B2B24
B1B195
D5D5A7
EDEDC5

Deuteranopia

7B8830
2D2F23
B0B098
D5D6AA
EEEFC7

Tritanopia

B12B29
362221
AD9E9F
D8B1B3
F2CDCF

Achromatopsia

4A4A4A
252525
AEAEAE
CCCCCC
E5E5E5

Shades & Tints Shades & Tints

#B9143C

Dark
Light

#371B27

Dark
Light

#ADB68B

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #b9143c;
  --color-2: #371b27;
  --color-3: #adb68b;
  --color-4: #d9cf9a;
  --color-5: #f3e6ba;
}

SCSS

$color-1: #b9143c;
$color-2: #371b27;
$color-3: #adb68b;
$color-4: #d9cf9a;
$color-5: #f3e6ba;

TAILWIND

colors: {
  'brand-1': '#b9143c',
  'brand-2': '#371b27',
  'brand-3': '#adb68b',
  'brand-4': '#d9cf9a',
  'brand-5': '#f3e6ba',
}

RGB Array

[185, 20, 60], [55, 27, 39], [173, 182, 139], [217, 207, 154], [243, 230, 186]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This nature-style palette of #B9143C, #371B27, #ADB68B, #D9CF9A, #F3E6BA is ideal for: infographics, data visualization, accessible design. High contrast ensures clear visual hierarchy and readability. It is a balanced and harmonious choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #b9143c; --color-2: #371b27; --color-3: #adb68b; --color-4: #d9cf9a; --color-5: #f3e6ba. 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 tech, SaaS, healthcare, eco industries. 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