#635960 + #33B395 + #98D9AD + #AEBFA3 + #6B603C - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#635960

Ink Gray · DimGray · Charcoal

HEX

#635960

RGB

rgb(99, 89, 96)

HSL

hsl(318, 5%, 37%)

HSB

hsb(318, 10%, 39%)

CMYK

cmyk(0%, 10%, 3%, 61%)

Oklch

oklch(47.6% 0.017 336.5)

Traditional「Ink Gray」· Paint「Charcoal」· Creative Midnight Shadow

#33B395

Mineral Blue · LightSeaGreen · Mint Ice

HEX

#33B395

RGB

rgb(51, 179, 149)

HSL

hsl(166, 56%, 45%)

HSB

hsb(166, 72%, 70%)

CMYK

cmyk(72%, 0%, 17%, 30%)

Oklch

oklch(69.1% 0.118 173.4)

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

#98D9AD

Celadon · LightGreen · Apple Green

HEX

#98D9AD

RGB

rgb(152, 217, 173)

HSL

hsl(139, 46%, 72%)

HSB

hsb(139, 30%, 85%)

CMYK

cmyk(30%, 0%, 20%, 15%)

Oklch

oklch(83.0% 0.090 154.4)

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

#AEBFA3

Celadon · DarkGray · Apple Green

HEX

#AEBFA3

RGB

rgb(174, 191, 163)

HSL

hsl(96, 18%, 69%)

HSB

hsb(96, 15%, 75%)

CMYK

cmyk(9%, 0%, 15%, 25%)

Oklch

oklch(78.4% 0.043 133.0)

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

#6B603C

Ochre · DarkOliveGreen · Honey Gold

HEX

#6B603C

RGB

rgb(107, 96, 60)

HSL

hsl(46, 28%, 33%)

HSB

hsb(46, 44%, 42%)

CMYK

cmyk(0%, 10%, 44%, 58%)

Oklch

oklch(49.0% 0.054 93.1)

Traditional「Ochre」· Paint「Honey Gold」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

635960

5A635C

Analogous

615A63

635960

635A5C

Triadic

635960

60635A

5A6063

Split-Comp.

635960

5C635A

5A6361

Tetradic

635960

63615A

5A635C

5A5C63

Contrast Matrix WCAG 2.1 Contrast

635960	33B395	98D9AD	AEBFA3	6B603C
—	2.6 Fail	4.1 AA Large	3.4 AA Large	1.1 Fail
2.6 Fail	—	1.6 Fail	1.3 Fail	2.4 Fail
4.1 AA Large	1.6 Fail	—	1.2 Fail	3.8 AA Large
3.4 AA Large	1.3 Fail	1.2 Fail	—	3.2 AA Large
1.1 Fail	2.4 Fail	3.8 AA Large	3.2 AA Large	—

White BG

6.7AA

2.6Fail

1.6Fail

1.9Fail

6.2AA

Black BG

3.1AA Large

8.0AAA

12.9AAA

10.8AAA

3.4AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

5F5F5E

6A6C9C

B4B5B8

B5B6AA

666645

Deuteranopia

5F605E

63599E

B0ACBA

B4B3AB

676847

Tritanopia

635D5D

39A2A3

9BC0C2

AFAFB0

6A4C4D

Achromatopsia

5D5D5D

898989

C1C1C1

B7B7B7

5F5F5F

Shades & Tints Shades & Tints

#635960

Dark

Light

#33B395

Dark

Light

#98D9AD

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #635960;
  --color-2: #33b395;
  --color-3: #98d9ad;
  --color-4: #aebfa3;
  --color-5: #6b603c;
}

SCSS

$color-1: #635960;
$color-2: #33b395;
$color-3: #98d9ad;
$color-4: #aebfa3;
$color-5: #6b603c;

TAILWIND

colors: {
  'brand-1': '#635960',
  'brand-2': '#33b395',
  'brand-3': '#98d9ad',
  'brand-4': '#aebfa3',
  'brand-5': '#6b603c',
}

RGB Array

[99, 89, 96], [51, 179, 149], [152, 217, 173], [174, 191, 163], [107, 96, 60]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #635960, #33B395, #98D9AD, #AEBFA3, #6B603C 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: #635960; --color-2: #33b395; --color-3: #98d9ad; --color-4: #aebfa3; --color-5: #6b603c. 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