← Back to Editor

#64F5A5 · #7E9C4F · #70355B · #B51854 · #F70546

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

#64F5A5

Emerald · MediumAquaMarine · Apple Green

HEX
#64F5A5
RGB
rgb(100, 245, 165)
HSL
hsl(147, 88%, 68%)
HSB
hsb(147, 59%, 96%)
CMYK
cmyk(59%, 0%, 33%, 4%)
Oklch
oklch(87.1% 0.169 156.0)

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

#7E9C4F

Grass Green · Gray · Olive Green

HEX
#7E9C4F
RGB
rgb(126, 156, 79)
HSL
hsl(83, 33%, 46%)
HSB
hsb(83, 49%, 61%)
CMYK
cmyk(19%, 0%, 49%, 39%)
Oklch
oklch(65.2% 0.110 126.8)

Traditional「Grass Green」· Paint「Olive Green」· Creative Blush Sunrise

#70355B

Rose Purple · DimGray · Camellia

HEX
#70355B
RGB
rgb(112, 53, 91)
HSL
hsl(321, 36%, 32%)
HSB
hsb(321, 53%, 44%)
CMYK
cmyk(0%, 53%, 19%, 56%)
Oklch
oklch(42.0% 0.097 342.8)

Traditional「Rose Purple」· Paint「Camellia」· Creative Blush Sunrise

#B51854

Dark Violet · Crimson · Camellia

HEX
#B51854
RGB
rgb(181, 24, 84)
HSL
hsl(337, 77%, 40%)
HSB
hsb(337, 87%, 71%)
CMYK
cmyk(0%, 87%, 54%, 29%)
Oklch
oklch(50.6% 0.190 6.0)

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

#F70546

Dark Violet · Crimson · Camellia

HEX
#F70546
RGB
rgb(247, 5, 70)
HSL
hsl(344, 96%, 49%)
HSB
hsb(344, 98%, 97%)
CMYK
cmyk(0%, 98%, 72%, 3%)
Oklch
oklch(61.9% 0.247 18.9)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

64F5A5
F566B5

Analogous

6DF566
64F5A5
66F5EE

Triadic

64F5A5
A666F5
F5A666

Split-Comp.

64F5A5
EE66F5
F5666D

Tetradic

64F5A5
666DF5
F566B5
F5EE66

Contrast Matrix WCAG 2.1 Contrast

64F5A5
7E9C4F
70355B
B51854
F70546
—
2.2
Fail
6.4
AA
4.7
AA
3.0
Fail
2.2
Fail
—
2.9
Fail
2.1
Fail
1.3
Fail
6.4
AA
2.9
Fail
—
1.4
Fail
2.2
Fail
4.7
AA
2.1
Fail
1.4
Fail
—
1.6
Fail
3.0
Fail
1.3
Fail
2.2
Fail
1.6
Fail
—
White BG
1.4Fail
3.1AA Large
8.9AAA
6.5AA
4.1AA Large
Black BG
15.1AAA
6.8AA
2.3Fail
3.2AA Large
5.1AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

A3A4B8
8B8B62
565652
717045
8E8C36

Deuteranopia

9A90BD
898766
5A5E50
7A8642
9CAE33

Tritanopia

6BC8CB
7F7074
6D4B49
AD3A38
EB2A27

Achromatopsia

C1C1C1
8A8A8A
4B4B4B
4E4E4E
555555

Shades & Tints Shades & Tints

#64F5A5

Dark
Light

#7E9C4F

Dark
Light

#70355B

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #64f5a5;
  --color-2: #7e9c4f;
  --color-3: #70355b;
  --color-4: #b51854;
  --color-5: #f70546;
}

SCSS

$color-1: #64f5a5;
$color-2: #7e9c4f;
$color-3: #70355b;
$color-4: #b51854;
$color-5: #f70546;

TAILWIND

colors: {
  'brand-1': '#64f5a5',
  'brand-2': '#7e9c4f',
  'brand-3': '#70355b',
  'brand-4': '#b51854',
  'brand-5': '#f70546',
}

RGB Array

[100, 245, 165], [126, 156, 79], [112, 53, 91], [181, 24, 84], [247, 5, 70]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This nature-style palette of #64F5A5, #7E9C4F, #70355B, #B51854, #F70546 is ideal for: social media posters, mobile apps, e-commerce promos. 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: #64f5a5; --color-2: #7e9c4f; --color-3: #70355b; --color-4: #b51854; --color-5: #f70546. 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. 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