#AC7757 + #AB9D76 + #99C99F + #A6DEB1 + #E2E7B1 · vintage - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

NostalgicClassicTimelessWarm

Industry INDUSTRY

CafePublishingCraft

UI Context UI CONTEXT

StorefrontDigital MenuPoster

Color Details Color Details

#AC7757

Tangerine · Sienna · Warm Sun

HEX

#AC7757

RGB

rgb(172, 119, 87)

HSL

hsl(23, 34%, 51%)

HSB

hsb(23, 49%, 67%)

CMYK

cmyk(0%, 31%, 49%, 33%)

Oklch

oklch(61.6% 0.081 51.8)

Traditional「Tangerine」· Paint「Warm Sun」· Creative Blush Sunrise

#AB9D76

Ginger · DarkSeaGreen · Sunflower

HEX

#AB9D76

RGB

rgb(171, 157, 118)

HSL

hsl(44, 24%, 57%)

HSB

hsb(44, 31%, 67%)

CMYK

cmyk(0%, 8%, 31%, 33%)

Oklch

oklch(69.8% 0.056 90.6)

Traditional「Ginger」· Paint「Sunflower」· Creative Blush Sunrise

#99C99F

Celadon · DarkSeaGreen · Apple Green

HEX

#99C99F

RGB

rgb(153, 201, 159)

HSL

hsl(128, 31%, 69%)

HSB

hsb(128, 24%, 79%)

CMYK

cmyk(24%, 0%, 21%, 21%)

Oklch

oklch(79.1% 0.078 148.1)

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

#A6DEB1

Celadon · Silver · Apple Green

HEX

#A6DEB1

RGB

rgb(166, 222, 177)

HSL

hsl(132, 46%, 76%)

HSB

hsb(132, 25%, 87%)

CMYK

cmyk(25%, 0%, 20%, 13%)

Oklch

oklch(85.0% 0.085 150.3)

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

#E2E7B1

Fresh Green · Wheat · Lemon Cream

HEX

#E2E7B1

RGB

rgb(226, 231, 177)

HSL

hsl(66, 53%, 80%)

HSB

hsb(66, 23%, 91%)

CMYK

cmyk(2%, 0%, 23%, 9%)

Oklch

oklch(91.1% 0.071 112.1)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

AC7757

588CAD

Analogous

AD5861

AC7757

ADA358

Triadic

AC7757

58AD78

7858AD

Split-Comp.

AC7757

58ADA3

5861AD

Tetradic

AC7757

61AD58

588CAD

A358AD

Contrast Matrix WCAG 2.1 Contrast

AC7757	AB9D76	99C99F	A6DEB1	E2E7B1
—	1.4 Fail	2.0 Fail	2.5 Fail	2.9 Fail
1.4 Fail	—	1.4 Fail	1.8 Fail	2.1 Fail
2.0 Fail	1.4 Fail	—	1.2 Fail	1.5 Fail
2.5 Fail	1.8 Fail	1.2 Fail	—	1.2 Fail
2.9 Fail	2.1 Fail	1.5 Fail	1.2 Fail	—

White BG

3.8AA Large

2.7Fail

1.9Fail

1.5Fail

1.3Fail

Black BG

5.5AA

7.8AAA

11.2AAA

13.7AAA

16.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

95955F

A5A57F

AEAEA9

BEBFBC

E4E4BE

Deuteranopia

989C61

A6A782

ABA7AC

BBB7BF

E4E4C1

Tritanopia

A96566

AA8789

9BB1B3

A9C4C6

E2C8CB

Achromatopsia

838383

9D9D9D

B6B6B6

C8C8C8

DFDFDF

Shades & Tints Shades & Tints

#AC7757

Dark

Light

#AB9D76

Dark

Light

#99C99F

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ac7757;
  --color-2: #ab9d76;
  --color-3: #99c99f;
  --color-4: #a6deb1;
  --color-5: #e2e7b1;
}

SCSS

$color-1: #ac7757;
$color-2: #ab9d76;
$color-3: #99c99f;
$color-4: #a6deb1;
$color-5: #e2e7b1;

TAILWIND

colors: {
  'brand-1': '#ac7757',
  'brand-2': '#ab9d76',
  'brand-3': '#99c99f',
  'brand-4': '#a6deb1',
  'brand-5': '#e2e7b1',
}

RGB Array

[172, 119, 87], [171, 157, 118], [153, 201, 159], [166, 222, 177], [226, 231, 177]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This vintage-style palette of #AC7757, #AB9D76, #99C99F, #A6DEB1, #E2E7B1 is ideal for: health products, baby brands, fresh-style blogs. 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: #ac7757; --color-2: #ab9d76; --color-3: #99c99f; --color-4: #a6deb1; --color-5: #e2e7b1. 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?

Light tones suit backgrounds; use dark colors for body text. Mid-tones work for card backgrounds or dividers to add depth. 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