#F79D61 + #F8746F + #B3816A + #90A98C + #EEE2A6 · nature - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

CalmOrganicGroundedWarm

Industry INDUSTRY

EcoWellnessOutdoor

UI Context UI CONTEXT

Brand WebsiteBlog

Color Details Color Details

#F79D61

Apricot · SandyBrown · Warm Sun

HEX

#F79D61

RGB

rgb(247, 157, 97)

HSL

hsl(24, 90%, 67%)

HSB

hsb(24, 61%, 97%)

CMYK

cmyk(0%, 36%, 61%, 3%)

Oklch

oklch(77.5% 0.132 53.3)

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

#F8746F

Peach Pink · Salmon · Coral Red

HEX

#F8746F

RGB

rgb(248, 116, 111)

HSL

hsl(2, 91%, 70%)

HSB

hsb(2, 55%, 97%)

CMYK

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

Oklch

oklch(71.4% 0.163 24.2)

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

#B3816A

Tangerine · Gray · Warm Sun

HEX

#B3816A

RGB

rgb(179, 129, 106)

HSL

hsl(19, 32%, 56%)

HSB

hsb(19, 41%, 70%)

CMYK

cmyk(0%, 28%, 41%, 30%)

Oklch

oklch(64.7% 0.071 45.7)

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

#90A98C

Celadon · DarkSeaGreen · Apple Green

HEX

#90A98C

RGB

rgb(144, 169, 140)

HSL

hsl(112, 14%, 61%)

HSB

hsb(112, 17%, 66%)

CMYK

cmyk(15%, 0%, 17%, 34%)

Oklch

oklch(70.8% 0.050 141.3)

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

#EEE2A6

Fresh Green · Wheat · Lemon Cream

HEX

#EEE2A6

RGB

rgb(238, 226, 166)

HSL

hsl(50, 68%, 79%)

HSB

hsb(50, 30%, 93%)

CMYK

cmyk(0%, 5%, 30%, 7%)

Oklch

oklch(90.8% 0.078 98.2)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F79D61

5FBAF7

Analogous

F75F6E

F79D61

F7E75F

Triadic

F79D61

5FF79C

9C5FF7

Split-Comp.

F79D61

5FF7E7

5F6EF7

Tetradic

F79D61

6EF75F

5FBAF7

E75FF7

Contrast Matrix WCAG 2.1 Contrast

F79D61	F8746F	B3816A	90A98C	EEE2A6
—	1.3 Fail	1.6 Fail	1.2 Fail	1.6 Fail
1.3 Fail	—	1.2 Fail	1.1 Fail	2.1 Fail
1.6 Fail	1.2 Fail	—	1.3 Fail	2.6 Fail
1.2 Fail	1.1 Fail	1.3 Fail	—	1.9 Fail
1.6 Fail	2.1 Fail	2.6 Fail	1.9 Fail	—

White BG

2.1Fail

2.7Fail

3.4AA Large

2.5Fail

1.3Fail

Black BG

10.0AAA

7.7AAA

6.3AA

8.2AAA

16.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

D0CF70

BFBE70

9D9D70

9B9B93

E9E9B5

Deuteranopia

D5DC73

C7D070

A0A471

999895

EAEAB8

Tritanopia

F27B7E

F17171

B07475

91999A

EDC0C3

Achromatopsia

B1B1B1

9B9B9B

8D8D8D

9E9E9E

DFDFDF

Shades & Tints Shades & Tints

#F79D61

Dark

Light

#F8746F

Dark

Light

#B3816A

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f79d61;
  --color-2: #f8746f;
  --color-3: #b3816a;
  --color-4: #90a98c;
  --color-5: #eee2a6;
}

SCSS

$color-1: #f79d61;
$color-2: #f8746f;
$color-3: #b3816a;
$color-4: #90a98c;
$color-5: #eee2a6;

TAILWIND

colors: {
  'brand-1': '#f79d61',
  'brand-2': '#f8746f',
  'brand-3': '#b3816a',
  'brand-4': '#90a98c',
  'brand-5': '#eee2a6',
}

RGB Array

[247, 157, 97], [248, 116, 111], [179, 129, 106], [144, 169, 140], [238, 226, 166]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This nature-style palette of #F79D61, #F8746F, #B3816A, #90A98C, #EEE2A6 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: #f79d61; --color-2: #f8746f; --color-3: #b3816a; --color-4: #90a98c; --color-5: #eee2a6. 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 nature-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