#CBD24D + #64B6B1 + #2289C1 + #6654BE + #6A3089 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#CBD24D

Autumn Sage · GreenYellow · Sunflower

HEX

#CBD24D

RGB

rgb(203, 210, 77)

HSL

hsl(63, 60%, 56%)

HSB

hsb(63, 63%, 82%)

CMYK

cmyk(3%, 0%, 63%, 18%)

Oklch

oklch(83.4% 0.154 112.2)

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

#64B6B1

Mineral Blue · MediumAquaMarine · Lake Green

HEX

#64B6B1

RGB

rgb(100, 182, 177)

HSL

hsl(176, 36%, 55%)

HSB

hsb(176, 45%, 71%)

CMYK

cmyk(45%, 0%, 3%, 29%)

Oklch

oklch(72.3% 0.081 190.4)

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

#2289C1

Lake Blue · SteelBlue · Navy Blue

HEX

#2289C1

RGB

rgb(34, 137, 193)

HSL

hsl(201, 70%, 45%)

HSB

hsb(201, 82%, 76%)

CMYK

cmyk(82%, 29%, 0%, 24%)

Oklch

oklch(60.0% 0.123 238.7)

Traditional「Lake Blue」· Paint「Navy Blue」· Creative Blush Sunrise

#6654BE

Deep Indigo · SlateBlue · Navy Blue

HEX

#6654BE

RGB

rgb(102, 84, 190)

HSL

hsl(250, 45%, 54%)

HSB

hsb(250, 56%, 75%)

CMYK

cmyk(46%, 56%, 0%, 25%)

Oklch

oklch(51.9% 0.160 287.3)

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

#6A3089

Dark Plum · DarkSlateBlue · Eggplant

HEX

#6A3089

RGB

rgb(106, 48, 137)

HSL

hsl(279, 48%, 36%)

HSB

hsb(279, 65%, 54%)

CMYK

cmyk(23%, 65%, 0%, 46%)

Oklch

oklch(43.0% 0.148 311.8)

Traditional「Dark Plum」· Paint「Eggplant」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

CBD24D

524BD2

Analogous

D2964B

CBD24D

88D24B

Triadic

CBD24D

4BCBD2

D24BCB

Split-Comp.

CBD24D

4B88D2

964BD2

Tetradic

CBD24D

4BD296

524BD2

D24B88

Contrast Matrix WCAG 2.1 Contrast

CBD24D	64B6B1	2289C1	6654BE	6A3089
—	1.5 Fail	2.4 Fail	3.6 AA Large	5.4 AA
1.5 Fail	—	1.6 Fail	2.5 Fail	3.7 AA Large
2.4 Fail	1.6 Fail	—	1.5 Fail	2.3 Fail
3.6 AA Large	2.5 Fail	1.5 Fail	—	1.5 Fail
5.4 AA	3.7 AA Large	2.3 Fail	1.5 Fail	—

White BG

1.6Fail

2.4Fail

3.9AA Large

5.9AA

8.8AAA

Black BG

12.9AAA

8.9AAA

5.4AA

3.6AA Large

2.4Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

CECE6D

8888B2

4F50B3

5E5EA4

515073

Deuteranopia

CECD75

837DB3

4941B0

5F619E

54596E

Tritanopia

CB878C

68B3B3

27A9A6

65908C

67625F

Achromatopsia

C1C1C1

9D9D9D

717171

656565

4B4B4B

Shades & Tints Shades & Tints

#CBD24D

Dark

Light

#64B6B1

Dark

Light

#2289C1

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #cbd24d;
  --color-2: #64b6b1;
  --color-3: #2289c1;
  --color-4: #6654be;
  --color-5: #6a3089;
}

SCSS

$color-1: #cbd24d;
$color-2: #64b6b1;
$color-3: #2289c1;
$color-4: #6654be;
$color-5: #6a3089;

TAILWIND

colors: {
  'brand-1': '#cbd24d',
  'brand-2': '#64b6b1',
  'brand-3': '#2289c1',
  'brand-4': '#6654be',
  'brand-5': '#6a3089',
}

RGB Array

[203, 210, 77], [100, 182, 177], [34, 137, 193], [102, 84, 190], [106, 48, 137]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #CBD24D, #64B6B1, #2289C1, #6654BE, #6A3089 is ideal for: corporate websites, product showcases, portfolios. 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: #cbd24d; --color-2: #64b6b1; --color-3: #2289c1; --color-4: #6654be; --color-5: #6a3089. 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. 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