#6FD9E6 + #BAE6BF + #F8753F + #DCCDBC + #B9A397 · vintage - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

NostalgicClassicTimelessWarmCool

Industry INDUSTRY

CafePublishingCraft

UI Context UI CONTEXT

StorefrontDigital MenuPoster

Color Details Color Details

#6FD9E6

Sky Blue · SkyBlue · Lake Green

HEX

#6FD9E6

RGB

rgb(111, 217, 230)

HSL

hsl(187, 70%, 67%)

HSB

hsb(187, 52%, 90%)

CMYK

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

Oklch

oklch(82.7% 0.100 206.0)

Traditional「Sky Blue」· Paint「Lake Green」· Creative Arctic Pool

#BAE6BF

Celadon · LightGray · Mint Green

HEX

#BAE6BF

RGB

rgb(186, 230, 191)

HSL

hsl(127, 47%, 82%)

HSB

hsb(127, 19%, 90%)

CMYK

cmyk(19%, 0%, 17%, 10%)

Oklch

oklch(88.3% 0.070 148.1)

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

#F8753F

Apricot · Tomato · Warm Sun

HEX

#F8753F

RGB

rgb(248, 117, 63)

HSL

hsl(18, 93%, 61%)

HSB

hsb(18, 75%, 97%)

CMYK

cmyk(0%, 53%, 75%, 3%)

Oklch

oklch(70.9% 0.174 41.6)

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

#DCCDBC

Goose Yellow · LightGray · Peach Orange

HEX

#DCCDBC

RGB

rgb(220, 205, 188)

HSL

hsl(32, 31%, 80%)

HSB

hsb(32, 15%, 86%)

CMYK

cmyk(0%, 7%, 15%, 14%)

Oklch

oklch(85.6% 0.029 70.9)

Traditional「Goose Yellow」· Paint「Peach Orange」· Creative Honey Glow

#B9A397

Apricot · DarkGray · Warm Sun

HEX

#B9A397

RGB

rgb(185, 163, 151)

HSL

hsl(21, 20%, 66%)

HSB

hsb(21, 18%, 73%)

CMYK

cmyk(0%, 12%, 18%, 27%)

Oklch

oklch(73.1% 0.031 50.5)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

6FD9E6

E67E70

Analogous

70E6B9

6FD9E6

709DE6

Triadic

6FD9E6

E670D8

D8E670

Split-Comp.

6FD9E6

E6709D

E6B970

Tetradic

6FD9E6

B970E6

E67E70

9DE670

Contrast Matrix WCAG 2.1 Contrast

6FD9E6	BAE6BF	F8753F	DCCDBC	B9A397
—	1.2 Fail	1.7 Fail	1.1 Fail	1.5 Fail
1.2 Fail	—	2.0 Fail	1.1 Fail	1.7 Fail
1.7 Fail	2.0 Fail	—	1.8 Fail	1.1 Fail
1.1 Fail	1.1 Fail	1.8 Fail	—	1.5 Fail
1.5 Fail	1.7 Fail	1.1 Fail	1.5 Fail	—

White BG

1.6Fail

1.4Fail

2.8Fail

1.6Fail

2.4Fail

Black BG

12.7AAA

15.2AAA

7.6AAA

13.5AAA

8.7AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

9D9EE3

CDCDC8

BFBE4C

D6D5C0

AFAF9A

Deuteranopia

978FE2

CBC7CB

C7D14F

D6D8C1

B1B29B

Tritanopia

74E0E0

BCD0D2

F15659

DBC3C4

B89C9D

Achromatopsia

BBBBBB

D4D4D4

969696

D0D0D0

A8A8A8

Shades & Tints Shades & Tints

#6FD9E6

Dark

Light

#BAE6BF

Dark

Light

#F8753F

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #6fd9e6;
  --color-2: #bae6bf;
  --color-3: #f8753f;
  --color-4: #dccdbc;
  --color-5: #b9a397;
}

SCSS

$color-1: #6fd9e6;
$color-2: #bae6bf;
$color-3: #f8753f;
$color-4: #dccdbc;
$color-5: #b9a397;

TAILWIND

colors: {
  'brand-1': '#6fd9e6',
  'brand-2': '#bae6bf',
  'brand-3': '#f8753f',
  'brand-4': '#dccdbc',
  'brand-5': '#b9a397',
}

RGB Array

[111, 217, 230], [186, 230, 191], [248, 117, 63], [220, 205, 188], [185, 163, 151]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This vintage-style palette of #6FD9E6, #BAE6BF, #F8753F, #DCCDBC, #B9A397 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: #6fd9e6; --color-2: #bae6bf; --color-3: #f8753f; --color-4: #dccdbc; --color-5: #b9a397. 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