#695B4A + #81938A + #9BC9C2 + #C1DB86 + #EAED40 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#695B4A

Ochre · DimGray · Amber Brown

HEX

#695B4A

RGB

rgb(105, 91, 74)

HSL

hsl(33, 17%, 35%)

HSB

hsb(33, 30%, 41%)

CMYK

cmyk(0%, 13%, 30%, 59%)

Oklch

oklch(48.0% 0.032 72.3)

Traditional「Ochre」· Paint「Amber Brown」· Creative Blush Sunrise

#81938A

Mineral Blue · LightSlateGray · Warm Gray

HEX

#81938A

RGB

rgb(129, 147, 138)

HSL

hsl(150, 8%, 54%)

HSB

hsb(150, 12%, 58%)

CMYK

cmyk(12%, 0%, 6%, 42%)

Oklch

oklch(64.6% 0.025 164.1)

Traditional「Mineral Blue」· Paint「Warm Gray」· Creative Urban Concrete

#9BC9C2

Jade · LightSteelBlue · Lake Green

HEX

#9BC9C2

RGB

rgb(155, 201, 194)

HSL

hsl(171, 30%, 70%)

HSB

hsb(171, 23%, 79%)

CMYK

cmyk(23%, 0%, 3%, 21%)

Oklch

oklch(80.1% 0.049 184.8)

Traditional「Jade」· Paint「Lake Green」· Creative Arctic Pool

#C1DB86

Willow Green · Tan · Apple Green

HEX

#C1DB86

RGB

rgb(193, 219, 134)

HSL

hsl(78, 54%, 69%)

HSB

hsb(78, 39%, 86%)

CMYK

cmyk(12%, 0%, 39%, 14%)

Oklch

oklch(85.3% 0.113 122.7)

Traditional「Willow Green」· Paint「Apple Green」· Creative Mint Breeze

#EAED40

Autumn Sage · GreenYellow · Sunflower

HEX

#EAED40

RGB

rgb(234, 237, 64)

HSL

hsl(61, 83%, 59%)

HSB

hsb(61, 73%, 93%)

CMYK

cmyk(1%, 0%, 73%, 7%)

Oklch

oklch(91.5% 0.182 110.5)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

695B4A

4A5868

Analogous

684C4A

695B4A

67684A

Triadic

695B4A

4A685B

5B4A68

Split-Comp.

695B4A

4A6768

4C4A68

Tetradic

695B4A

4A684C

4A5868

684A67

Contrast Matrix WCAG 2.1 Contrast

695B4A	81938A	9BC9C2	C1DB86	EAED40
—	2.0 Fail	3.6 AA Large	4.3 AA Large	5.2 AA
2.0 Fail	—	1.8 Fail	2.1 Fail	2.6 Fail
3.6 AA Large	1.8 Fail	—	1.2 Fail	1.4 Fail
4.3 AA Large	2.1 Fail	1.2 Fail	—	1.2 Fail
5.2 AA	2.6 Fail	1.4 Fail	1.2 Fail	—

White BG

6.6AA

3.2AA Large

1.8Fail

1.5Fail

1.3Fail

Black BG

3.2AA Large

6.5AA

11.5AAA

13.7AAA

16.7AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

63634E

89898C

AFAFC4

CCCC9B

EBEB6A

Deuteranopia

64654F

88868D

ACA9C4

CBC9A0

EBEB74

Tritanopia

685152

828E8E

9DC5C5

C2ABAE

EA8B92

Achromatopsia

5D5D5D

8D8D8D

BABABA

CACACA

D8D8D8

Shades & Tints Shades & Tints

#695B4A

Dark

Light

#81938A

Dark

Light

#9BC9C2

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #695b4a;
  --color-2: #81938a;
  --color-3: #9bc9c2;
  --color-4: #c1db86;
  --color-5: #eaed40;
}

SCSS

$color-1: #695b4a;
$color-2: #81938a;
$color-3: #9bc9c2;
$color-4: #c1db86;
$color-5: #eaed40;

TAILWIND

colors: {
  'brand-1': '#695b4a',
  'brand-2': '#81938a',
  'brand-3': '#9bc9c2',
  'brand-4': '#c1db86',
  'brand-5': '#eaed40',
}

RGB Array

[105, 91, 74], [129, 147, 138], [155, 201, 194], [193, 219, 134], [234, 237, 64]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #695B4A, #81938A, #9BC9C2, #C1DB86, #EAED40 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: #695b4a; --color-2: #81938a; --color-3: #9bc9c2; --color-4: #c1db86; --color-5: #eaed40. 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