#007C64 + #77BD74 + #BDBA7C + #AEB976 + #E7D241 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#007C64

Mineral Blue · Teal · Peacock Green

HEX

#007C64

RGB

rgb(0, 124, 100)

HSL

hsl(168, 100%, 24%)

HSB

hsb(168, 100%, 49%)

CMYK

cmyk(100%, 0%, 19%, 51%)

Oklch

oklch(52.3% 0.100 172.9)

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

#77BD74

Celadon · DarkSeaGreen · Olive Green

HEX

#77BD74

RGB

rgb(119, 189, 116)

HSL

hsl(118, 36%, 60%)

HSB

hsb(118, 39%, 74%)

CMYK

cmyk(37%, 0%, 39%, 26%)

Oklch

oklch(73.4% 0.125 143.3)

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

#BDBA7C

Fresh Green · Tan · Sunflower

HEX

#BDBA7C

RGB

rgb(189, 186, 124)

HSL

hsl(57, 33%, 61%)

HSB

hsb(57, 34%, 74%)

CMYK

cmyk(0%, 2%, 34%, 26%)

Oklch

oklch(77.7% 0.082 105.8)

Traditional「Fresh Green」· Paint「Sunflower」· Creative Lemon Fizz

#AEB976

Grass Green · DarkSeaGreen · Olive Green

HEX

#AEB976

RGB

rgb(174, 185, 118)

HSL

hsl(70, 32%, 59%)

HSB

hsb(70, 36%, 73%)

CMYK

cmyk(6%, 0%, 36%, 27%)

Oklch

oklch(76.1% 0.090 116.2)

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

#E7D241

Autumn Sage · SandyBrown · Sunflower

HEX

#E7D241

RGB

rgb(231, 210, 65)

HSL

hsl(52, 78%, 58%)

HSB

hsb(52, 72%, 91%)

CMYK

cmyk(0%, 9%, 72%, 9%)

Oklch

oklch(85.7% 0.158 100.8)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

007C64

7A0018

Analogous

007A25

007C64

00567A

Triadic

007C64

62007A

7A6200

Split-Comp.

007C64

7A0056

7A2500

Tetradic

007C64

25007A

7A0018

567A00

Contrast Matrix WCAG 2.1 Contrast

007C64	77BD74	BDBA7C	AEB976	E7D241
—	2.3 Fail	2.6 Fail	2.5 Fail	3.4 AA Large
2.3 Fail	—	1.1 Fail	1.1 Fail	1.5 Fail
2.6 Fail	1.1 Fail	—	1.0 Fail	1.3 Fail
2.5 Fail	1.1 Fail	1.0 Fail	—	1.4 Fail
3.4 AA Large	1.5 Fail	1.3 Fail	1.4 Fail	—

White BG

5.2AA

2.3Fail

2.0Fail

2.1Fail

1.5Fail

Black BG

4.1AA Large

9.3AAA

10.5AAA

10.0AAA

13.7AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

36376A

959686

BCBC8B

B3B386

DEDE64

Deuteranopia

2F256B

918C8A

BCBC8F

B2B18A

DFE16D

Tritanopia

066E6F

7B9497

BD9799

AF9396

E68086

Achromatopsia

545454

A0A0A0

B4B4B4

AEAEAE

C8C8C8

Shades & Tints Shades & Tints

#007C64

Dark

Light

#77BD74

Dark

Light

#BDBA7C

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #007c64;
  --color-2: #77bd74;
  --color-3: #bdba7c;
  --color-4: #aeb976;
  --color-5: #e7d241;
}

SCSS

$color-1: #007c64;
$color-2: #77bd74;
$color-3: #bdba7c;
$color-4: #aeb976;
$color-5: #e7d241;

TAILWIND

colors: {
  'brand-1': '#007c64',
  'brand-2': '#77bd74',
  'brand-3': '#bdba7c',
  'brand-4': '#aeb976',
  'brand-5': '#e7d241',
}

RGB Array

[0, 124, 100], [119, 189, 116], [189, 186, 124], [174, 185, 118], [231, 210, 65]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #007C64, #77BD74, #BDBA7C, #AEB976, #E7D241 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: #007c64; --color-2: #77bd74; --color-3: #bdba7c; --color-4: #aeb976; --color-5: #e7d241. 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