#918D69 + #F44645 + #BAC253 + #F2EDC2 + #BDD9D0 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#918D69

Autumn Sage · Gray · Honey Gold

HEX

#918D69

RGB

rgb(145, 141, 105)

HSL

hsl(54, 16%, 49%)

HSB

hsb(54, 28%, 57%)

CMYK

cmyk(0%, 3%, 28%, 43%)

Oklch

oklch(63.7% 0.051 102.4)

Traditional「Autumn Sage」· Paint「Honey Gold」· Creative Blush Sunrise

#F44645

Peach Pink · Tomato · Coral Red

HEX

#F44645

RGB

rgb(244, 70, 69)

HSL

hsl(0, 89%, 61%)

HSB

hsb(0, 72%, 96%)

CMYK

cmyk(0%, 71%, 72%, 4%)

Oklch

oklch(64.7% 0.211 25.6)

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

#BAC253

Autumn Sage · Tan · Sunflower

HEX

#BAC253

RGB

rgb(186, 194, 83)

HSL

hsl(64, 48%, 54%)

HSB

hsb(64, 57%, 76%)

CMYK

cmyk(4%, 0%, 57%, 24%)

Oklch

oklch(78.6% 0.135 112.9)

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

#F2EDC2

Fresh Green · Bisque · Lemon Cream

HEX

#F2EDC2

RGB

rgb(242, 237, 194)

HSL

hsl(54, 65%, 85%)

HSB

hsb(54, 20%, 95%)

CMYK

cmyk(0%, 2%, 20%, 5%)

Oklch

oklch(93.9% 0.056 101.9)

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

#BDD9D0

Jade · LightGray · Glacier Blue

HEX

#BDD9D0

RGB

rgb(189, 217, 208)

HSL

hsl(161, 27%, 80%)

HSB

hsb(161, 13%, 85%)

CMYK

cmyk(13%, 0%, 4%, 15%)

Oklch

oklch(86.2% 0.032 174.2)

Traditional「Jade」· Paint「Glacier Blue」· Creative Arctic Pool

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

918D69

696D91

Analogous

917969

918D69

819169

Triadic

918D69

69918D

8D6991

Split-Comp.

918D69

698191

796991

Tetradic

918D69

699179

696D91

916981

Contrast Matrix WCAG 2.1 Contrast

918D69	F44645	BAC253	F2EDC2	BDD9D0
—	1.1 Fail	1.8 Fail	2.8 Fail	2.3 Fail
1.1 Fail	—	1.9 Fail	3.0 AA Large	2.4 Fail
1.8 Fail	1.9 Fail	—	1.6 Fail	1.3 Fail
2.8 Fail	3.0 AA Large	1.6 Fail	—	1.3 Fail
2.3 Fail	2.4 Fail	1.3 Fail	1.3 Fail	—

White BG

3.4AA Large

3.6AA Large

1.9Fail

1.2Fail

1.5Fail

Black BG

6.2AA

5.8AA

10.9AAA

17.7AAA

14.0AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

8F8F72

A9A745

BDBE6E

F0F0CC

C9C9D2

Deuteranopia

909074

B3C045

BDBC74

F0F0CF

C8C5D3

Tritanopia

91797A

EB4545

BA8388

F2D5D6

BED4D4

Achromatopsia

8A8A8A

7A7A7A

B3B3B3

EAEAEA

D0D0D0

Shades & Tints Shades & Tints

#918D69

Dark

Light

#F44645

Dark

Light

#BAC253

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #918d69;
  --color-2: #f44645;
  --color-3: #bac253;
  --color-4: #f2edc2;
  --color-5: #bdd9d0;
}

SCSS

$color-1: #918d69;
$color-2: #f44645;
$color-3: #bac253;
$color-4: #f2edc2;
$color-5: #bdd9d0;

TAILWIND

colors: {
  'brand-1': '#918d69',
  'brand-2': '#f44645',
  'brand-3': '#bac253',
  'brand-4': '#f2edc2',
  'brand-5': '#bdd9d0',
}

RGB Array

[145, 141, 105], [244, 70, 69], [186, 194, 83], [242, 237, 194], [189, 217, 208]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #918D69, #F44645, #BAC253, #F2EDC2, #BDD9D0 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: #918d69; --color-2: #f44645; --color-3: #bac253; --color-4: #f2edc2; --color-5: #bdd9d0. 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