← Back to Editor

#3BA6C2 · #EDCF99 · #412C3E · #CBBB38 · #1E1318

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

#3BA6C2

Lake Blue · LightSeaGreen · Mint Ice

HEX
#3BA6C2
RGB
rgb(59, 166, 194)
HSL
hsl(192, 53%, 50%)
HSB
hsb(192, 70%, 76%)
CMYK
cmyk(70%, 14%, 0%, 24%)
Oklch
oklch(67.6% 0.103 218.8)

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

#EDCF99

Goose Yellow · Khaki · Peach Orange

HEX
#EDCF99
RGB
rgb(237, 207, 153)
HSL
hsl(39, 70%, 76%)
HSB
hsb(39, 35%, 93%)
CMYK
cmyk(0%, 13%, 35%, 7%)
Oklch
oklch(86.7% 0.078 82.0)

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

#412C3E

Rose Purple · DarkSlateGray · Eggplant

HEX
#412C3E
RGB
rgb(65, 44, 62)
HSL
hsl(309, 19%, 21%)
HSB
hsb(309, 32%, 25%)
CMYK
cmyk(0%, 32%, 5%, 75%)
Oklch
oklch(32.5% 0.043 331.6)

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

#CBBB38

Autumn Sage · GoldenRod · Sunflower

HEX
#CBBB38
RGB
rgb(203, 187, 56)
HSL
hsl(53, 59%, 51%)
HSB
hsb(53, 72%, 80%)
CMYK
cmyk(0%, 8%, 72%, 20%)
Oklch
oklch(78.3% 0.146 102.2)

Traditional「Autumn Sage」· Paint「Sunflower」· Creative Blush Sunrise

#1E1318

Dark Violet · Black · Raspberry

HEX
#1E1318
RGB
rgb(30, 19, 24)
HSL
hsl(333, 22%, 10%)
HSB
hsb(333, 37%, 12%)
CMYK
cmyk(0%, 37%, 20%, 88%)
Oklch
oklch(20.3% 0.020 350.1)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

3BA6C2
C3573C

Analogous

3CC39B
3BA6C2
3C64C3

Triadic

3BA6C2
C33CA8
A8C33C

Split-Comp.

3BA6C2
C33C64
C39B3C

Tetradic

3BA6C2
9B3CC3
C3573C
64C33C

Contrast Matrix WCAG 2.1 Contrast

3BA6C2
EDCF99
412C3E
CBBB38
1E1318
—
1.9
Fail
4.5
AA Large
1.4
Fail
6.4
AA
1.9
Fail
—
8.5
AAA
1.3
Fail
12.0
AAA
4.5
AA Large
8.5
AAA
—
6.5
AA
1.4
Fail
1.4
Fail
1.3
Fail
6.5
AA
—
9.2
AAA
6.4
AA
12.0
AAA
1.4
Fail
9.2
AAA
—
White BG
2.8Fail
1.5Fail
12.7AAA
2.0Fail
18.1AAA
Black BG
7.4AAA
14.0AAA
1.7Fail
10.7AAA
1.2Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

696ABB
E0E0A6
38383A
C4C458
191917

Deuteranopia

635BBA
E2E4A9
393B39
C5C65F
1A1B16

Tritanopia

40B6B5
EBB0B3
403635
CA7176
1D1616

Achromatopsia

898989
D2D2D2
343434
B1B1B1
171717

Shades & Tints Shades & Tints

#3BA6C2

Dark
Light

#EDCF99

Dark
Light

#412C3E

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #3ba6c2;
  --color-2: #edcf99;
  --color-3: #412c3e;
  --color-4: #cbbb38;
  --color-5: #1e1318;
}

SCSS

$color-1: #3ba6c2;
$color-2: #edcf99;
$color-3: #412c3e;
$color-4: #cbbb38;
$color-5: #1e1318;

TAILWIND

colors: {
  'brand-1': '#3ba6c2',
  'brand-2': '#edcf99',
  'brand-3': '#412c3e',
  'brand-4': '#cbbb38',
  'brand-5': '#1e1318',
}

RGB Array

[59, 166, 194], [237, 207, 153], [65, 44, 62], [203, 187, 56], [30, 19, 24]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #3BA6C2, #EDCF99, #412C3E, #CBBB38, #1E1318 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: #3ba6c2; --color-2: #edcf99; --color-3: #412c3e; --color-4: #cbbb38; --color-5: #1e1318. 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