← Back to Editor

#43434C · #416171 · #349E97 · #9FE7B6 · #E9F8DF

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#43434C

Dark Cyan · DarkSlateGray · Charcoal

HEX
#43434C
RGB
rgb(67, 67, 76)
HSL
hsl(240, 6%, 28%)
HSB
hsb(240, 12%, 30%)
CMYK
cmyk(12%, 12%, 0%, 70%)
Oklch
oklch(38.6% 0.015 285.7)

Traditional「Dark Cyan」· Paint「Charcoal」· Creative Midnight Shadow

#416171

Slate Blue · DimGray · Prussian Blue

HEX
#416171
RGB
rgb(65, 97, 113)
HSL
hsl(200, 27%, 35%)
HSB
hsb(200, 42%, 44%)
CMYK
cmyk(42%, 14%, 0%, 56%)
Oklch
oklch(47.4% 0.045 230.6)

Traditional「Slate Blue」· Paint「Prussian Blue」· Creative Blush Sunrise

#349E97

Mineral Blue · LightSeaGreen · Mint Ice

HEX
#349E97
RGB
rgb(52, 158, 151)
HSL
hsl(176, 50%, 41%)
HSB
hsb(176, 67%, 62%)
CMYK
cmyk(67%, 0%, 4%, 38%)
Oklch
oklch(63.8% 0.095 188.7)

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

#9FE7B6

Emerald · LightGreen · Apple Green

HEX
#9FE7B6
RGB
rgb(159, 231, 182)
HSL
hsl(139, 60%, 76%)
HSB
hsb(139, 31%, 91%)
CMYK
cmyk(31%, 0%, 21%, 9%)
Oklch
oklch(86.7% 0.099 154.1)

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

#E9F8DF

Emerald · Beige · Mint Green

HEX
#E9F8DF
RGB
rgb(233, 248, 223)
HSL
hsl(96, 64%, 92%)
HSB
hsb(96, 10%, 97%)
CMYK
cmyk(6%, 0%, 10%, 3%)
Oklch
oklch(96.1% 0.037 132.6)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

43434C
4C4C43

Analogous

43474C
43434C
47434C

Triadic

43434C
4C4343
434C43

Split-Comp.

43434C
4C4743
474C43

Tetradic

43434C
4C4347
4C4C43
434C47

Contrast Matrix WCAG 2.1 Contrast

43434C
416171
349E97
9FE7B6
E9F8DF
—
1.5
Fail
3.0
AA Large
6.8
AA
8.8
AAA
1.5
Fail
—
2.0
Fail
4.6
AA
6.0
AA
3.0
AA Large
2.0
Fail
—
2.2
Fail
2.9
Fail
6.8
AA
4.6
AA
2.2
Fail
—
1.3
Fail
8.8
AAA
6.0
AA
2.9
Fail
1.3
Fail
—
White BG
9.8AAA
6.6AA
3.2AA Large
1.4Fail
1.1Fail
Black BG
2.1Fail
3.2AA Large
6.5AA
14.6AAA
19.0AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

43434A
4F4F6D
626399
BEBFC2
EFF0E5

Deuteranopia

434349
4D4B6C
5C5499
BAB5C5
EFEEE7

Tritanopia

434848
436A69
399A9A
A3CBCD
EAEAEB

Achromatopsia

444444
595959
7E7E7E
CCCCCC
F1F1F1

Shades & Tints Shades & Tints

#43434C

Dark
Light

#416171

Dark
Light

#349E97

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #43434c;
  --color-2: #416171;
  --color-3: #349e97;
  --color-4: #9fe7b6;
  --color-5: #e9f8df;
}

SCSS

$color-1: #43434c;
$color-2: #416171;
$color-3: #349e97;
$color-4: #9fe7b6;
$color-5: #e9f8df;

TAILWIND

colors: {
  'brand-1': '#43434c',
  'brand-2': '#416171',
  'brand-3': '#349e97',
  'brand-4': '#9fe7b6',
  'brand-5': '#e9f8df',
}

RGB Array

[67, 67, 76], [65, 97, 113], [52, 158, 151], [159, 231, 182], [233, 248, 223]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #43434C, #416171, #349E97, #9FE7B6, #E9F8DF 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: #43434c; --color-2: #416171; --color-3: #349e97; --color-4: #9fe7b6; --color-5: #e9f8df. 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