#B3B3B3 + #9FCC9D + #77FA73 + #3FEB8C + #0DD1A7 · vintage - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

NostalgicClassicTimelessWarmCool

Industry INDUSTRY

CafePublishingCraft

UI Context UI CONTEXT

StorefrontDigital MenuPoster

Color Details Color Details

#B3B3B3

Ash · DarkGray · Silver Sand

HEX

#B3B3B3

RGB

rgb(179, 179, 179)

HSL

hsl(0, 0%, 70%)

HSB

hsb(0, 0%, 70%)

CMYK

cmyk(0%, 0%, 0%, 30%)

Oklch

oklch(76.7% 0.000 89.9)

Traditional「Ash」· Paint「Silver Sand」· Creative Urban Concrete

#9FCC9D

Celadon · DarkSeaGreen · Apple Green

HEX

#9FCC9D

RGB

rgb(159, 204, 157)

HSL

hsl(117, 32%, 71%)

HSB

hsb(117, 23%, 80%)

CMYK

cmyk(22%, 0%, 23%, 20%)

Oklch

oklch(80.1% 0.081 143.7)

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

#77FA73

Emerald · LightGreen · Apple Green

HEX

#77FA73

RGB

rgb(119, 250, 115)

HSL

hsl(118, 93%, 72%)

HSB

hsb(118, 54%, 98%)

CMYK

cmyk(52%, 0%, 54%, 2%)

Oklch

oklch(88.2% 0.211 143.0)

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

#3FEB8C

Emerald · MediumAquaMarine · Olive Green

HEX

#3FEB8C

RGB

rgb(63, 235, 140)

HSL

hsl(147, 81%, 58%)

HSB

hsb(147, 73%, 92%)

CMYK

cmyk(73%, 0%, 40%, 8%)

Oklch

oklch(83.3% 0.191 153.9)

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

#0DD1A7

Mineral Blue · LightSeaGreen · Mint Ice

HEX

#0DD1A7

RGB

rgb(13, 209, 167)

HSL

hsl(167, 88%, 44%)

HSB

hsb(167, 94%, 82%)

CMYK

cmyk(94%, 0%, 20%, 18%)

Oklch

oklch(76.7% 0.148 171.2)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

B3B3B3

Analogous

B3B3B3

Triadic

B3B3B3

Split-Comp.

B3B3B3

Tetradic

B3B3B3

Contrast Matrix WCAG 2.1 Contrast

B3B3B3	9FCC9D	77FA73	3FEB8C	0DD1A7
—	1.2 Fail	1.6 Fail	1.3 Fail	1.1 Fail
1.2 Fail	—	1.4 Fail	1.2 Fail	1.1 Fail
1.6 Fail	1.4 Fail	—	1.2 Fail	1.5 Fail
1.3 Fail	1.2 Fail	1.2 Fail	—	1.3 Fail
1.1 Fail	1.1 Fail	1.5 Fail	1.3 Fail	—

White BG

2.1Fail

1.8Fail

1.3Fail

1.6Fail

2.0Fail

Black BG

10.0AAA

11.6AAA

15.7AAA

13.5AAA

10.7AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

B3B3B3

B2B3A8

B0B194

898BA3

6264B1

Deuteranopia

B3B3B3

B0ADAB

A89E9C

8073A9

5748B4

Tritanopia

B3B3B3

A1B1B3

7EADB3

48B5B9

17B9BB

Achromatopsia

B3B3B3

B9B9B9

C3C3C3

ADADAD

929292

Shades & Tints Shades & Tints

#B3B3B3

Dark

Light

#9FCC9D

Dark

Light

#77FA73

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #b3b3b3;
  --color-2: #9fcc9d;
  --color-3: #77fa73;
  --color-4: #3feb8c;
  --color-5: #0dd1a7;
}

SCSS

$color-1: #b3b3b3;
$color-2: #9fcc9d;
$color-3: #77fa73;
$color-4: #3feb8c;
$color-5: #0dd1a7;

TAILWIND

colors: {
  'brand-1': '#b3b3b3',
  'brand-2': '#9fcc9d',
  'brand-3': '#77fa73',
  'brand-4': '#3feb8c',
  'brand-5': '#0dd1a7',
}

RGB Array

[179, 179, 179], [159, 204, 157], [119, 250, 115], [63, 235, 140], [13, 209, 167]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This vintage-style palette of #B3B3B3, #9FCC9D, #77FA73, #3FEB8C, #0DD1A7 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: #b3b3b3; --color-2: #9fcc9d; --color-3: #77fa73; --color-4: #3feb8c; --color-5: #0dd1a7. 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 vintage-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