← Back to Editor

#369186 · #D4F9D4 · #764749 · #C1A385 · #EAD5AF

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#369186

Mineral Blue · MediumSeaGreen · Mint Ice

HEX
#369186
RGB
rgb(54, 145, 134)
HSL
hsl(173, 46%, 39%)
HSB
hsb(173, 63%, 57%)
CMYK
cmyk(63%, 0%, 8%, 43%)
Oklch
oklch(60.0% 0.087 184.1)

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

#D4F9D4

Emerald · Beige · Mint Green

HEX
#D4F9D4
RGB
rgb(212, 249, 212)
HSL
hsl(120, 76%, 90%)
HSB
hsb(120, 15%, 98%)
CMYK
cmyk(15%, 0%, 15%, 2%)
Oklch
oklch(94.6% 0.062 145.1)

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

#764749

Crimson · DimGray · Wine Red

HEX
#764749
RGB
rgb(118, 71, 73)
HSL
hsl(357, 25%, 37%)
HSB
hsb(357, 40%, 46%)
CMYK
cmyk(0%, 40%, 38%, 54%)
Oklch
oklch(45.3% 0.065 17.2)

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

#C1A385

Ginger · Tan · Warm Sun

HEX
#C1A385
RGB
rgb(193, 163, 133)
HSL
hsl(30, 33%, 64%)
HSB
hsb(30, 31%, 76%)
CMYK
cmyk(0%, 16%, 31%, 24%)
Oklch
oklch(73.5% 0.054 66.8)

Traditional「Ginger」· Paint「Warm Sun」· Creative Honey Glow

#EAD5AF

Goose Yellow · Wheat · Peach Orange

HEX
#EAD5AF
RGB
rgb(234, 213, 175)
HSL
hsl(39, 58%, 80%)
HSB
hsb(39, 25%, 92%)
CMYK
cmyk(0%, 9%, 25%, 8%)
Oklch
oklch(88.1% 0.055 82.3)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

369186
913640

Analogous

369159
369186
366E91

Triadic

369186
873691
918736

Split-Comp.

369186
91366E
915936

Tetradic

369186
593691
913640
6E9136

Contrast Matrix WCAG 2.1 Contrast

369186
D4F9D4
764749
C1A385
EAD5AF
—
3.3
AA Large
2.0
Fail
1.6
Fail
2.6
Fail
3.3
AA Large
—
6.6
AA
2.1
Fail
1.3
Fail
2.0
Fail
6.6
AA
—
3.2
AA Large
5.3
AA
1.6
Fail
2.1
Fail
3.2
AA Large
—
1.7
Fail
2.6
Fail
1.3
Fail
5.3
AA
1.7
Fail
—
White BG
3.8AA Large
1.1Fail
7.6AAA
2.4Fail
1.4Fail
Black BG
5.6AA
18.3AAA
2.8Fail
8.8AAA
14.6AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

5D5E89
E4E4DD
626149
B4B48C
E1E1B8

Deuteranopia

585189
E2DFDF
646848
B6B88E
E2E4BA

Tritanopia

3B8B8B
D6E4E6
744848
C09293
E9BFC1

Achromatopsia

757575
EAEAEA
555555
A9A9A9
D7D7D7

Shades & Tints Shades & Tints

#369186

Dark
Light

#D4F9D4

Dark
Light

#764749

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #369186;
  --color-2: #d4f9d4;
  --color-3: #764749;
  --color-4: #c1a385;
  --color-5: #ead5af;
}

SCSS

$color-1: #369186;
$color-2: #d4f9d4;
$color-3: #764749;
$color-4: #c1a385;
$color-5: #ead5af;

TAILWIND

colors: {
  'brand-1': '#369186',
  'brand-2': '#d4f9d4',
  'brand-3': '#764749',
  'brand-4': '#c1a385',
  'brand-5': '#ead5af',
}

RGB Array

[54, 145, 134], [212, 249, 212], [118, 71, 73], [193, 163, 133], [234, 213, 175]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #369186, #D4F9D4, #764749, #C1A385, #EAD5AF 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: #369186; --color-2: #d4f9d4; --color-3: #764749; --color-4: #c1a385; --color-5: #ead5af. 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 general-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