← Back to Editor

#372772 · #056C99 · #15B1AD · #6CCB93 · #EAE194

nature

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

VibrantFreshWarmCool

Industry INDUSTRY

EcoWellnessOutdoor

UI Context UI CONTEXT

Landing PageMobile AppData Visualization

Color Details Color Details

#372772

Deep Indigo · MidnightBlue · Prussian Blue

HEX
#372772
RGB
rgb(55, 39, 114)
HSL
hsl(253, 49%, 30%)
HSB
hsb(253, 66%, 45%)
CMYK
cmyk(52%, 66%, 0%, 55%)
Oklch
oklch(33.8% 0.123 287.8)

Traditional「Deep Indigo」· Paint「Prussian Blue」· Creative Blush Sunrise

#056C99

Lake Blue · Teal · Mint Ice

HEX
#056C99
RGB
rgb(5, 108, 153)
HSL
hsl(198, 94%, 31%)
HSB
hsb(198, 97%, 60%)
CMYK
cmyk(97%, 29%, 0%, 40%)
Oklch
oklch(50.3% 0.107 236.5)

Traditional「Lake Blue」· Paint「Mint Ice」· Creative Blush Sunrise

#15B1AD

Mineral Blue · LightSeaGreen · Mint Ice

HEX
#15B1AD
RGB
rgb(21, 177, 173)
HSL
hsl(178, 79%, 39%)
HSB
hsb(178, 88%, 69%)
CMYK
cmyk(88%, 0%, 2%, 31%)
Oklch
oklch(68.8% 0.115 191.9)

Traditional「Mineral Blue」· Paint「Mint Ice」· Creative Blush Sunrise

#6CCB93

Celadon · MediumAquaMarine · Apple Green

HEX
#6CCB93
RGB
rgb(108, 203, 147)
HSL
hsl(145, 48%, 61%)
HSB
hsb(145, 47%, 80%)
CMYK
cmyk(47%, 0%, 28%, 20%)
Oklch
oklch(76.9% 0.122 156.1)

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

#EAE194

Fresh Green · Khaki · Sunflower

HEX
#EAE194
RGB
rgb(234, 225, 148)
HSL
hsl(54, 67%, 75%)
HSB
hsb(54, 37%, 92%)
CMYK
cmyk(0%, 4%, 37%, 8%)
Oklch
oklch(90.0% 0.098 102.4)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

372772
627227

Analogous

273C72
372772
5D2772

Triadic

372772
723727
277237

Split-Comp.

372772
725D27
3C7227

Tetradic

372772
72273C
627227
27725D

Contrast Matrix WCAG 2.1 Contrast

372772
056C99
15B1AD
6CCB93
EAE194
—
2.1
Fail
4.7
AA
6.3
AA
9.3
AAA
2.1
Fail
—
2.2
Fail
2.9
Fail
4.3
AA Large
4.7
AA
2.2
Fail
—
1.3
Fail
2.0
Fail
6.3
AA
2.9
Fail
1.3
Fail
—
1.5
Fail
9.3
AAA
4.3
AA Large
2.0
Fail
1.5
Fail
—
White BG
12.4AAA
5.8AA
2.7Fail
2.0Fail
1.3Fail
Black BG
1.7Fail
3.6AA Large
7.9AAA
10.6AAA
15.7AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

303060
32338E
595AAE
9596A1
E6E6A7

Deuteranopia

31325C
2C248C
5044AE
9089A4
E7E7AB

Tritanopia

36524E
0A8684
1DAFAF
71ABAE
EAB5B9

Achromatopsia

343434
525252
828282
A8A8A8
DBDBDB

Shades & Tints Shades & Tints

#372772

Dark
Light

#056C99

Dark
Light

#15B1AD

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #372772;
  --color-2: #056c99;
  --color-3: #15b1ad;
  --color-4: #6ccb93;
  --color-5: #eae194;
}

SCSS

$color-1: #372772;
$color-2: #056c99;
$color-3: #15b1ad;
$color-4: #6ccb93;
$color-5: #eae194;

TAILWIND

colors: {
  'brand-1': '#372772',
  'brand-2': '#056c99',
  'brand-3': '#15b1ad',
  'brand-4': '#6ccb93',
  'brand-5': '#eae194',
}

RGB Array

[55, 39, 114], [5, 108, 153], [21, 177, 173], [108, 203, 147], [234, 225, 148]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This nature-style palette of #372772, #056C99, #15B1AD, #6CCB93, #EAE194 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: #372772; --color-2: #056c99; --color-3: #15b1ad; --color-4: #6ccb93; --color-5: #eae194. 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