#629AA7 + #91A0B3 + #E4B3C6 + #FBB591 + #FFBD67 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#629AA7

Slate Blue · CadetBlue · Lake Green

HEX

#629AA7

RGB

rgb(98, 154, 167)

HSL

hsl(191, 28%, 52%)

HSB

hsb(191, 41%, 65%)

CMYK

cmyk(41%, 8%, 0%, 35%)

Oklch

oklch(65.2% 0.062 214.0)

Traditional「Slate Blue」· Paint「Lake Green」· Creative Blush Sunrise

#91A0B3

Azure · DarkGray · Cobalt Blue

HEX

#91A0B3

RGB

rgb(145, 160, 179)

HSL

hsl(214, 18%, 64%)

HSB

hsb(214, 19%, 70%)

CMYK

cmyk(19%, 11%, 0%, 30%)

Oklch

oklch(70.0% 0.033 254.4)

Traditional「Azure」· Paint「Cobalt Blue」· Creative Twilight Haze

#E4B3C6

Rouge · LightPink · Cherry Blossom

HEX

#E4B3C6

RGB

rgb(228, 179, 198)

HSL

hsl(337, 48%, 80%)

HSB

hsb(337, 21%, 89%)

CMYK

cmyk(0%, 21%, 13%, 11%)

Oklch

oklch(81.6% 0.062 353.4)

Traditional「Rouge」· Paint「Cherry Blossom」· Creative Rose Petal

#FBB591

Apricot · BurlyWood · Peach Orange

HEX

#FBB591

RGB

rgb(251, 181, 145)

HSL

hsl(20, 93%, 78%)

HSB

hsb(20, 42%, 98%)

CMYK

cmyk(0%, 28%, 42%, 2%)

Oklch

oklch(83.0% 0.095 48.2)

Traditional「Apricot」· Paint「Peach Orange」· Creative Honey Glow

#FFBD67

Ginger · SandyBrown · Warm Sun

HEX

#FFBD67

RGB

rgb(255, 189, 103)

HSL

hsl(34, 100%, 70%)

HSB

hsb(34, 60%, 100%)

CMYK

cmyk(0%, 26%, 60%, 0%)

Oklch

oklch(84.2% 0.128 71.8)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

629AA7

A76F62

Analogous

62A791

629AA7

6278A7

Triadic

629AA7

A7629A

9AA762

Split-Comp.

629AA7

A76278

A79162

Tetradic

629AA7

9162A7

A76F62

78A762

Contrast Matrix WCAG 2.1 Contrast

629AA7	91A0B3	E4B3C6	FBB591	FFBD67
—	1.2 Fail	1.7 Fail	1.8 Fail	1.9 Fail
1.2 Fail	—	1.5 Fail	1.5 Fail	1.6 Fail
1.7 Fail	1.5 Fail	—	1.0 Fail	1.1 Fail
1.8 Fail	1.5 Fail	1.0 Fail	—	1.1 Fail
1.9 Fail	1.6 Fail	1.1 Fail	1.1 Fail	—

White BG

3.1AA Large

2.7Fail

1.8Fail

1.7Fail

Black BG

6.7AA

7.9AAA

11.6AAA

12.1AAA

12.7AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

7A7BA4

9798AE

CFCEC1

DDDC9A

E2E27C

Deuteranopia

7773A3

9796AD

D2D5C0

E1E69C

E6EB81

Tritanopia

65A1A1

92ABAA

E2BEBD

F8A1A2

FC8C90

Achromatopsia

8B8B8B

9E9E9E

C4C4C4

C6C6C6

C7C7C7

Shades & Tints Shades & Tints

#629AA7

Dark

Light

#91A0B3

Dark

Light

#E4B3C6

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #629aa7;
  --color-2: #91a0b3;
  --color-3: #e4b3c6;
  --color-4: #fbb591;
  --color-5: #ffbd67;
}

SCSS

$color-1: #629aa7;
$color-2: #91a0b3;
$color-3: #e4b3c6;
$color-4: #fbb591;
$color-5: #ffbd67;

TAILWIND

colors: {
  'brand-1': '#629aa7',
  'brand-2': '#91a0b3',
  'brand-3': '#e4b3c6',
  'brand-4': '#fbb591',
  'brand-5': '#ffbd67',
}

RGB Array

[98, 154, 167], [145, 160, 179], [228, 179, 198], [251, 181, 145], [255, 189, 103]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #629AA7, #91A0B3, #E4B3C6, #FBB591, #FFBD67 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: #629aa7; --color-2: #91a0b3; --color-3: #e4b3c6; --color-4: #fbb591; --color-5: #ffbd67. 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 general-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