← Back to Editor

#7F7D44 · #2BABE0 · #00C3E1 · #0FF4C8 · #CBF500

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicWarmCool

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial App

Color Details Color Details

#7F7D44

Autumn Sage · DimGray · Honey Gold

HEX
#7F7D44
RGB
rgb(127, 125, 68)
HSL
hsl(58, 30%, 38%)
HSB
hsb(58, 46%, 50%)
CMYK
cmyk(0%, 2%, 46%, 50%)
Oklch
oklch(57.8% 0.078 106.8)

Traditional「Autumn Sage」· Paint「Honey Gold」· Creative Blush Sunrise

#2BABE0

Lake Blue · DodgerBlue · Lake Green

HEX
#2BABE0
RGB
rgb(43, 171, 224)
HSL
hsl(198, 74%, 52%)
HSB
hsb(198, 81%, 88%)
CMYK
cmyk(81%, 24%, 0%, 12%)
Oklch
oklch(69.8% 0.130 231.6)

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

#00C3E1

Lake Blue · DarkTurquoise · Mint Ice

HEX
#00C3E1
RGB
rgb(0, 195, 225)
HSL
hsl(188, 100%, 44%)
HSB
hsb(188, 100%, 88%)
CMYK
cmyk(100%, 13%, 0%, 12%)
Oklch
oklch(75.1% 0.132 213.9)

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

#0FF4C8

Mineral Blue · DarkTurquoise · Lake Green

HEX
#0FF4C8
RGB
rgb(15, 244, 200)
HSL
hsl(168, 91%, 51%)
HSB
hsb(168, 94%, 96%)
CMYK
cmyk(94%, 0%, 18%, 4%)
Oklch
oklch(86.3% 0.164 173.2)

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

#CBF500

Grass Green · Yellow · Olive Green

HEX
#CBF500
RGB
rgb(203, 245, 0)
HSL
hsl(70, 100%, 48%)
HSB
hsb(70, 100%, 96%)
CMYK
cmyk(17%, 0%, 100%, 4%)
Oklch
oklch(90.8% 0.219 121.4)

Traditional「Grass Green」· Paint「Olive Green」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

7F7D44
44467E

Analogous

7E5F44
7F7D44
637E44

Triadic

7F7D44
447E7C
7C447E

Split-Comp.

7F7D44
44637E
5F447E

Tetradic

7F7D44
447E5F
44467E
7E4463

Contrast Matrix WCAG 2.1 Contrast

7F7D44
2BABE0
00C3E1
0FF4C8
CBF500
—
1.6
Fail
2.0
Fail
3.0
AA Large
3.4
AA Large
1.6
Fail
—
1.2
Fail
1.8
Fail
2.1
Fail
2.0
Fail
1.2
Fail
—
1.5
Fail
1.7
Fail
3.0
AA Large
1.8
Fail
1.5
Fail
—
1.1
Fail
3.4
AA Large
2.1
Fail
1.7
Fail
1.1
Fail
—
White BG
4.3AA Large
2.6Fail
2.1Fail
1.4Fail
1.3Fail
Black BG
4.9AA
8.0AAA
9.9AAA
14.8AAA
16.6AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

7E7E52
6264D3
5456DA
7274D3
DDDE3B

Deuteranopia

7E7E55
5B51D0
493BD8
6554D5
DBD84A

Tritanopia

7F5D5F
31C9C7
0AD4D3
1ADBDD
CD6A74

Achromatopsia

777777
8B8B8B
8C8C8C
ABABAB
CDCDCD

Shades & Tints Shades & Tints

#7F7D44

Dark
Light

#2BABE0

Dark
Light

#00C3E1

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #7f7d44;
  --color-2: #2babe0;
  --color-3: #00c3e1;
  --color-4: #0ff4c8;
  --color-5: #cbf500;
}

SCSS

$color-1: #7f7d44;
$color-2: #2babe0;
$color-3: #00c3e1;
$color-4: #0ff4c8;
$color-5: #cbf500;

TAILWIND

colors: {
  'brand-1': '#7f7d44',
  'brand-2': '#2babe0',
  'brand-3': '#00c3e1',
  'brand-4': '#0ff4c8',
  'brand-5': '#cbf500',
}

RGB Array

[127, 125, 68], [43, 171, 224], [0, 195, 225], [15, 244, 200], [203, 245, 0]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #7F7D44, #2BABE0, #00C3E1, #0FF4C8, #CBF500 is ideal for: social media posters, mobile apps, e-commerce promos. Vivid colors effectively attract user attention. It is a vibrant and energetic choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #7f7d44; --color-2: #2babe0; --color-3: #00c3e1; --color-4: #0ff4c8; --color-5: #cbf500. 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 food & dining, entertainment, kids education, social industries. Bold colors convey vitality and innovation. 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