#A07258 + #B3976C + #C7C18C + #E5D7B3 + #F8AA84 · vintage - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

NostalgicClassicTimelessWarm

Industry INDUSTRY

CafePublishingCraft

UI Context UI CONTEXT

StorefrontDigital MenuPoster

Color Details Color Details

#A07258

Tangerine · Gray · Amber Brown

HEX

#A07258

RGB

rgb(160, 114, 88)

HSL

hsl(22, 29%, 49%)

HSB

hsb(22, 45%, 63%)

CMYK

cmyk(0%, 29%, 45%, 37%)

Oklch

oklch(59.2% 0.070 50.4)

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

#B3976C

Ginger · Tan · Warm Sun

HEX

#B3976C

RGB

rgb(179, 151, 108)

HSL

hsl(36, 32%, 56%)

HSB

hsb(36, 40%, 70%)

CMYK

cmyk(0%, 16%, 40%, 30%)

Oklch

oklch(69.1% 0.067 78.0)

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

#C7C18C

Fresh Green · Tan · Sunflower

HEX

#C7C18C

RGB

rgb(199, 193, 140)

HSL

hsl(54, 35%, 66%)

HSB

hsb(54, 30%, 78%)

CMYK

cmyk(0%, 3%, 30%, 22%)

Oklch

oklch(80.3% 0.071 102.4)

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

#E5D7B3

Goose Yellow · Wheat · Lemon Cream

HEX

#E5D7B3

RGB

rgb(229, 215, 179)

HSL

hsl(43, 49%, 80%)

HSB

hsb(43, 22%, 90%)

CMYK

cmyk(0%, 6%, 22%, 10%)

Oklch

oklch(88.1% 0.050 89.3)

Traditional「Goose Yellow」· Paint「Lemon Cream」· Creative Lemon Fizz

#F8AA84

Apricot · LightSalmon · Warm Sun

HEX

#F8AA84

RGB

rgb(248, 170, 132)

HSL

hsl(20, 89%, 75%)

HSB

hsb(20, 47%, 97%)

CMYK

cmyk(0%, 31%, 47%, 3%)

Oklch

oklch(80.5% 0.106 46.7)

Traditional「Apricot」· Paint「Warm Sun」· Creative Honey Glow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

A07258

5987A1

Analogous

A15962

A07258

A19859

Triadic

A07258

59A173

7359A1

Split-Comp.

A07258

59A198

5962A1

Tetradic

A07258

62A159

5987A1

9859A1

Contrast Matrix WCAG 2.1 Contrast

A07258	B3976C	C7C18C	E5D7B3	F8AA84
—	1.5 Fail	2.3 Fail	2.9 Fail	2.2 Fail
1.5 Fail	—	1.5 Fail	1.9 Fail	1.5 Fail
2.3 Fail	1.5 Fail	—	1.3 Fail	1.0 Fail
2.9 Fail	1.9 Fail	1.3 Fail	—	1.3 Fail
2.2 Fail	1.5 Fail	1.0 Fail	1.3 Fail	—

White BG

4.2AA Large

2.8Fail

1.8Fail

1.4Fail

1.9Fail

Black BG

5.0AA

7.6AAA

11.4AAA

14.7AAA

11.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

8C8C5E

A7A776

C4C499

DFDFBC

D6D68D

Deuteranopia

8F9260

A9AB79

C5C59C

E0E1BE

DBE18F

Tritanopia

9E6364

B27F80

C7A3A5

E4C3C4

F49496

Achromatopsia

7D7D7D

9A9A9A

BDBDBD

D7D7D7

BDBDBD

Shades & Tints Shades & Tints

#A07258

Dark

Light

#B3976C

Dark

Light

#C7C18C

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #a07258;
  --color-2: #b3976c;
  --color-3: #c7c18c;
  --color-4: #e5d7b3;
  --color-5: #f8aa84;
}

SCSS

$color-1: #a07258;
$color-2: #b3976c;
$color-3: #c7c18c;
$color-4: #e5d7b3;
$color-5: #f8aa84;

TAILWIND

colors: {
  'brand-1': '#a07258',
  'brand-2': '#b3976c',
  'brand-3': '#c7c18c',
  'brand-4': '#e5d7b3',
  'brand-5': '#f8aa84',
}

RGB Array

[160, 114, 88], [179, 151, 108], [199, 193, 140], [229, 215, 179], [248, 170, 132]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This vintage-style palette of #A07258, #B3976C, #C7C18C, #E5D7B3, #F8AA84 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: #a07258; --color-2: #b3976c; --color-3: #c7c18c; --color-4: #e5d7b3; --color-5: #f8aa84. 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