← Back to Editor

#7DD1B7 · #3B2F41 · #DC4F75 · #F2A088 · #EDD19B

nature

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

CalmOrganicGroundedWarmCool

Industry INDUSTRY

EcoWellnessOutdoor

UI Context UI CONTEXT

Brand WebsiteBlogData Visualization

Color Details Color Details

#7DD1B7

Jade · MediumAquaMarine · Lake Green

HEX
#7DD1B7
RGB
rgb(125, 209, 183)
HSL
hsl(161, 48%, 65%)
HSB
hsb(161, 40%, 82%)
CMYK
cmyk(40%, 0%, 12%, 18%)
Oklch
oklch(80.0% 0.091 172.1)

Traditional「Jade」· Paint「Lake Green」· Creative Arctic Pool

#3B2F41

Dark Plum · DarkSlateGray · Eggplant

HEX
#3B2F41
RGB
rgb(59, 47, 65)
HSL
hsl(280, 16%, 22%)
HSB
hsb(280, 28%, 25%)
CMYK
cmyk(9%, 28%, 0%, 75%)
Oklch
oklch(32.6% 0.035 314.3)

Traditional「Dark Plum」· Paint「Eggplant」· Creative Blush Sunrise

#DC4F75

Dark Violet · LightCoral · Rose Pink

HEX
#DC4F75
RGB
rgb(220, 79, 117)
HSL
hsl(344, 67%, 59%)
HSB
hsb(344, 64%, 86%)
CMYK
cmyk(0%, 64%, 47%, 14%)
Oklch
oklch(62.7% 0.178 7.4)

Traditional「Dark Violet」· Paint「Rose Pink」· Creative Blush Sunrise

#F2A088

Peach Pink · LightSalmon · Coral Red

HEX
#F2A088
RGB
rgb(242, 160, 136)
HSL
hsl(14, 80%, 74%)
HSB
hsb(14, 44%, 95%)
CMYK
cmyk(0%, 34%, 44%, 5%)
Oklch
oklch(78.1% 0.104 37.0)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

#EDD19B

Goose Yellow · Khaki · Lemon Cream

HEX
#EDD19B
RGB
rgb(237, 209, 155)
HSL
hsl(40, 69%, 77%)
HSB
hsb(40, 35%, 93%)
CMYK
cmyk(0%, 12%, 35%, 7%)
Oklch
oklch(87.1% 0.077 83.5)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

7DD1B7
D17B96

Analogous

7BD18B
7DD1B7
7BC1D1

Triadic

7DD1B7
B57BD1
D1B57B

Split-Comp.

7DD1B7
D17BC1
D18B7B

Tetradic

7DD1B7
8B7BD1
D17B96
C1D17B

Contrast Matrix WCAG 2.1 Contrast

7DD1B7
3B2F41
DC4F75
F2A088
EDD19B
—
7.0
AA
2.2
Fail
1.1
Fail
1.2
Fail
7.0
AA
—
3.2
AA Large
6.1
AA
8.5
AAA
2.2
Fail
3.2
AA Large
—
1.9
Fail
2.6
Fail
1.1
Fail
6.1
AA
1.9
Fail
—
1.4
Fail
1.2
Fail
8.5
AAA
2.6
Fail
1.4
Fail
—
White BG
1.8Fail
12.6AAA
3.9AA Large
2.1Fail
1.5Fail
Black BG
11.7AAA
1.7Fail
5.4AA
10.2AAA
14.2AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

A1A2BD
36363D
9F9E6C
CECE8E
E1E1A8

Deuteranopia

9D96BF
37373C
A7B26A
D3D98F
E3E5AB

Tritanopia

81C2C3
3A3938
D56563
EE9293
ECB2B5

Achromatopsia

B5B5B5
353535
7D7D7D
B6B6B6
D3D3D3

Shades & Tints Shades & Tints

#7DD1B7

Dark
Light

#3B2F41

Dark
Light

#DC4F75

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #7dd1b7;
  --color-2: #3b2f41;
  --color-3: #dc4f75;
  --color-4: #f2a088;
  --color-5: #edd19b;
}

SCSS

$color-1: #7dd1b7;
$color-2: #3b2f41;
$color-3: #dc4f75;
$color-4: #f2a088;
$color-5: #edd19b;

TAILWIND

colors: {
  'brand-1': '#7dd1b7',
  'brand-2': '#3b2f41',
  'brand-3': '#dc4f75',
  'brand-4': '#f2a088',
  'brand-5': '#edd19b',
}

RGB Array

[125, 209, 183], [59, 47, 65], [220, 79, 117], [242, 160, 136], [237, 209, 155]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This nature-style palette of #7DD1B7, #3B2F41, #DC4F75, #F2A088, #EDD19B 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: #7dd1b7; --color-2: #3b2f41; --color-3: #dc4f75; --color-4: #f2a088; --color-5: #edd19b. 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