#779989 + #9D9E7E + #BD9668 + #FE863D + #FF4D3D · warm - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#779989

Mineral Blue · LightSlateGray · Olive Green

HEX

#779989

RGB

rgb(119, 153, 137)

HSL

hsl(152, 14%, 53%)

HSB

hsb(152, 22%, 60%)

CMYK

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

Oklch

oklch(65.3% 0.045 164.7)

Traditional「Mineral Blue」· Paint「Olive Green」· Creative Blush Sunrise

#9D9E7E

Autumn Sage · DarkSeaGreen · Sunflower

HEX

#9D9E7E

RGB

rgb(157, 158, 126)

HSL

hsl(62, 14%, 56%)

HSB

hsb(62, 20%, 62%)

CMYK

cmyk(1%, 0%, 20%, 38%)

Oklch

oklch(69.0% 0.045 109.0)

Traditional「Autumn Sage」· Paint「Sunflower」· Creative Blush Sunrise

#BD9668

Ginger · DarkSalmon · Warm Sun

HEX

#BD9668

RGB

rgb(189, 150, 104)

HSL

hsl(32, 39%, 57%)

HSB

hsb(32, 45%, 74%)

CMYK

cmyk(0%, 21%, 45%, 26%)

Oklch

oklch(69.9% 0.078 70.6)

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

#FE863D

Apricot · Coral · Warm Sun

HEX

#FE863D

RGB

rgb(254, 134, 61)

HSL

hsl(23, 99%, 62%)

HSB

hsb(23, 76%, 100%)

CMYK

cmyk(0%, 47%, 76%, 0%)

Oklch

oklch(74.2% 0.168 48.8)

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

#FF4D3D

Peach Pink · Tomato · Coral Red

HEX

#FF4D3D

RGB

rgb(255, 77, 61)

HSL

hsl(5, 100%, 62%)

HSB

hsb(5, 76%, 100%)

CMYK

cmyk(0%, 70%, 76%, 0%)

Oklch

oklch(67.1% 0.217 29.2)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

779989

987686

Analogous

769877

779989

769798

Triadic

779989

887698

988876

Split-Comp.

779989

987697

987776

Tetradic

779989

777698

987686

979876

Contrast Matrix WCAG 2.1 Contrast

779989	9D9E7E	BD9668	FE863D	FF4D3D
—	1.1 Fail	1.2 Fail	1.3 Fail	1.1 Fail
1.1 Fail	—	1.0 Fail	1.1 Fail	1.2 Fail
1.2 Fail	1.0 Fail	—	1.1 Fail	1.2 Fail
1.3 Fail	1.1 Fail	1.1 Fail	—	1.4 Fail
1.1 Fail	1.2 Fail	1.2 Fail	1.4 Fail	—

White BG

3.1AA Large

2.8Fail

2.7Fail

2.4Fail

3.3AA Large

Black BG

6.7AA

7.6AAA

7.7AAA

8.7AAA

6.4AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

86868D

9D9D86

ACAC73

CAC94F

B2B041

Deuteranopia

84818E

9D9D88

AEB176

D1DA53

BCCA42

Tritanopia

799091

9D8C8D

BB7C7E

F85D60

F64445

Achromatopsia

8D8D8D

9A9A9A

9C9C9C

A2A2A2

808080

Shades & Tints Shades & Tints

#779989

Dark

Light

#9D9E7E

Dark

Light

#BD9668

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #779989;
  --color-2: #9d9e7e;
  --color-3: #bd9668;
  --color-4: #fe863d;
  --color-5: #ff4d3d;
}

SCSS

$color-1: #779989;
$color-2: #9d9e7e;
$color-3: #bd9668;
$color-4: #fe863d;
$color-5: #ff4d3d;

TAILWIND

colors: {
  'brand-1': '#779989',
  'brand-2': '#9d9e7e',
  'brand-3': '#bd9668',
  'brand-4': '#fe863d',
  'brand-5': '#ff4d3d',
}

RGB Array

[119, 153, 137], [157, 158, 126], [189, 150, 104], [254, 134, 61], [255, 77, 61]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This warm-style palette of #779989, #9D9E7E, #BD9668, #FE863D, #FF4D3D 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: #779989; --color-2: #9d9e7e; --color-3: #bd9668; --color-4: #fe863d; --color-5: #ff4d3d. 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 warm-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