#B42121 + #C0442B + #69B488 + #B2B584 + #BCCE8F · vintage - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

NostalgicClassicTimelessWarm

Industry INDUSTRY

CafePublishingCraft

UI Context UI CONTEXT

StorefrontDigital MenuPoster

Color Details Color Details

#B42121

Vermilion · FireBrick · Passion Red

HEX

#B42121

RGB

rgb(180, 33, 33)

HSL

hsl(0, 69%, 42%)

HSB

hsb(0, 82%, 71%)

CMYK

cmyk(0%, 82%, 82%, 29%)

Oklch

oklch(50.0% 0.182 27.0)

Traditional「Vermilion」· Paint「Passion Red」· Creative Blush Sunrise

#C0442B

Vermilion · Sienna · Passion Red

HEX

#C0442B

RGB

rgb(192, 68, 43)

HSL

hsl(10, 63%, 46%)

HSB

hsb(10, 78%, 75%)

CMYK

cmyk(0%, 65%, 78%, 25%)

Oklch

oklch(55.6% 0.164 33.3)

Traditional「Vermilion」· Paint「Passion Red」· Creative Blush Sunrise

#69B488

Celadon · CadetBlue · Olive Green

HEX

#69B488

RGB

rgb(105, 180, 136)

HSL

hsl(145, 33%, 56%)

HSB

hsb(145, 42%, 71%)

CMYK

cmyk(42%, 0%, 24%, 29%)

Oklch

oklch(70.9% 0.100 156.9)

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

#B2B584

Fresh Green · Tan · Sunflower

HEX

#B2B584

RGB

rgb(178, 181, 132)

HSL

hsl(64, 25%, 61%)

HSB

hsb(64, 27%, 71%)

CMYK

cmyk(2%, 0%, 27%, 29%)

Oklch

oklch(75.8% 0.066 110.8)

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

#BCCE8F

Willow Green · Tan · Apple Green

HEX

#BCCE8F

RGB

rgb(188, 206, 143)

HSL

hsl(77, 39%, 68%)

HSB

hsb(77, 31%, 81%)

CMYK

cmyk(9%, 0%, 31%, 19%)

Oklch

oklch(82.2% 0.086 121.3)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

B42121

21B5B5

Analogous

B5216B

B42121

B56B21

Triadic

B42121

21B521

2121B5

Split-Comp.

B42121

21B56B

216BB5

Tetradic

B42121

6BB521

21B5B5

6B21B5

Contrast Matrix WCAG 2.1 Contrast

B42121	C0442B	69B488	B2B584	BCCE8F
—	1.3 Fail	2.7 Fail	3.1 AA Large	3.9 AA Large
1.3 Fail	—	2.1 Fail	2.4 Fail	3.0 AA Large
2.7 Fail	2.1 Fail	—	1.2 Fail	1.5 Fail
3.1 AA Large	2.4 Fail	1.2 Fail	—	1.3 Fail
3.9 AA Large	3.0 AA Large	1.5 Fail	1.3 Fail	—

White BG

6.6AA

5.1AA

2.5Fail

2.1Fail

1.7Fail

Black BG

3.2AA Large

4.1AA Large

8.5AAA

9.8AAA

12.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

747321

8A8931

898A93

B3B390

C4C49E

Deuteranopia

7D8821

929B33

858095

B3B393

C3C1A2

Tritanopia

AD2121

BA3637

6D9B9D

B2999B

BDAAAD

Achromatopsia

4D4D4D

666666

999999

AFAFAF

C1C1C1

Shades & Tints Shades & Tints

#B42121

Dark

Light

#C0442B

Dark

Light

#69B488

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #b42121;
  --color-2: #c0442b;
  --color-3: #69b488;
  --color-4: #b2b584;
  --color-5: #bcce8f;
}

SCSS

$color-1: #b42121;
$color-2: #c0442b;
$color-3: #69b488;
$color-4: #b2b584;
$color-5: #bcce8f;

TAILWIND

colors: {
  'brand-1': '#b42121',
  'brand-2': '#c0442b',
  'brand-3': '#69b488',
  'brand-4': '#b2b584',
  'brand-5': '#bcce8f',
}

RGB Array

[180, 33, 33], [192, 68, 43], [105, 180, 136], [178, 181, 132], [188, 206, 143]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This vintage-style palette of #B42121, #C0442B, #69B488, #B2B584, #BCCE8F 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: #b42121; --color-2: #c0442b; --color-3: #69b488; --color-4: #b2b584; --color-5: #bcce8f. 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