← Back to Editor

#B0EDC6 · #4ED9BF · #3CABAB · #357990 · #262F4F

bright

A 5-color bright 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

#B0EDC6

Emerald · LightBlue · Mint Green

HEX
#B0EDC6
RGB
rgb(176, 237, 198)
HSL
hsl(142, 63%, 81%)
HSB
hsb(142, 26%, 93%)
CMYK
cmyk(26%, 0%, 16%, 7%)
Oklch
oklch(89.4% 0.082 156.3)

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

#4ED9BF

Mineral Blue · MediumTurquoise · Lake Green

HEX
#4ED9BF
RGB
rgb(78, 217, 191)
HSL
hsl(169, 65%, 58%)
HSB
hsb(169, 64%, 85%)
CMYK
cmyk(64%, 0%, 12%, 15%)
Oklch
oklch(80.4% 0.125 178.1)

Traditional「Mineral Blue」· Paint「Lake Green」· Creative Blush Sunrise

#3CABAB

Slate Blue · LightSeaGreen · Mint Ice

HEX
#3CABAB
RGB
rgb(60, 171, 171)
HSL
hsl(180, 48%, 45%)
HSB
hsb(180, 65%, 67%)
CMYK
cmyk(65%, 0%, 0%, 33%)
Oklch
oklch(68.0% 0.098 195.1)

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

#357990

Slate Blue · SteelBlue · Mint Ice

HEX
#357990
RGB
rgb(53, 121, 144)
HSL
hsl(195, 46%, 39%)
HSB
hsb(195, 63%, 56%)
CMYK
cmyk(63%, 16%, 0%, 44%)
Oklch
oklch(54.2% 0.077 223.2)

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

#262F4F

Indigo · DarkSlateGray · Prussian Blue

HEX
#262F4F
RGB
rgb(38, 47, 79)
HSL
hsl(227, 35%, 23%)
HSB
hsb(227, 52%, 31%)
CMYK
cmyk(52%, 41%, 0%, 69%)
Oklch
oklch(31.3% 0.059 270.8)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

B0EDC6
EDB0D7

Analogous

B8EDB0
B0EDC6
B0EDE5

Triadic

B0EDC6
C6B0ED
EDC6B0

Split-Comp.

B0EDC6
E5B0ED
EDB0B8

Tetradic

B0EDC6
B0B8ED
EDB0D7
EDE5B0

Contrast Matrix WCAG 2.1 Contrast

B0EDC6
4ED9BF
3CABAB
357990
262F4F
—
1.3
Fail
2.1
Fail
3.7
AA Large
9.8
AAA
1.3
Fail
—
1.6
Fail
2.8
Fail
7.5
AAA
2.1
Fail
1.6
Fail
—
1.8
Fail
4.7
AA
3.7
AA Large
2.8
Fail
1.8
Fail
—
2.7
Fail
9.8
AAA
7.5
AAA
4.7
AA
2.7
Fail
—
White BG
1.3Fail
1.7Fail
2.8Fail
4.9AA
13.1AAA
Black BG
15.8AAA
12.0AAA
7.6AAA
4.3AA Large
1.6Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

CACBCF
8A8BC5
6C6DAB
52538A
2A2A47

Deuteranopia

C7C2D2
8278C7
665DAB
4F4989
292945

Tritanopia

B3D7D9
55CACB
42ABAB
388685
264140

Achromatopsia

D6D6D6
ACACAC
8A8A8A
676767
303030

Shades & Tints Shades & Tints

#B0EDC6

Dark
Light

#4ED9BF

Dark
Light

#3CABAB

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #b0edc6;
  --color-2: #4ed9bf;
  --color-3: #3cabab;
  --color-4: #357990;
  --color-5: #262f4f;
}

SCSS

$color-1: #b0edc6;
$color-2: #4ed9bf;
$color-3: #3cabab;
$color-4: #357990;
$color-5: #262f4f;

TAILWIND

colors: {
  'brand-1': '#b0edc6',
  'brand-2': '#4ed9bf',
  'brand-3': '#3cabab',
  'brand-4': '#357990',
  'brand-5': '#262f4f',
}

RGB Array

[176, 237, 198], [78, 217, 191], [60, 171, 171], [53, 121, 144], [38, 47, 79]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This bright-style palette of #B0EDC6, #4ED9BF, #3CABAB, #357990, #262F4F 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: #b0edc6; --color-2: #4ed9bf; --color-3: #3cabab; --color-4: #357990; --color-5: #262f4f. 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 bright-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