#1F6061 + #BA9D72 + #DE9A66 + #BA4D47 + #692946 · cool - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#1F6061

Lake Blue · DarkSlateGray · Peacock Green

HEX

#1F6061

RGB

rgb(31, 96, 97)

HSL

hsl(181, 52%, 25%)

HSB

hsb(181, 68%, 38%)

CMYK

cmyk(68%, 1%, 0%, 62%)

Oklch

oklch(44.9% 0.064 196.6)

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

#BA9D72

Ginger · Tan · Warm Sun

HEX

#BA9D72

RGB

rgb(186, 157, 114)

HSL

hsl(36, 34%, 59%)

HSB

hsb(36, 39%, 73%)

CMYK

cmyk(0%, 16%, 39%, 27%)

Oklch

oklch(71.2% 0.068 77.1)

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

#DE9A66

Apricot · DarkSalmon · Warm Sun

HEX

#DE9A66

RGB

rgb(222, 154, 102)

HSL

hsl(26, 65%, 64%)

HSB

hsb(26, 54%, 87%)

CMYK

cmyk(0%, 31%, 54%, 13%)

Oklch

oklch(74.2% 0.106 57.6)

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

#BA4D47

Crimson · Sienna · Passion Red

HEX

#BA4D47

RGB

rgb(186, 77, 71)

HSL

hsl(3, 45%, 50%)

HSB

hsb(3, 62%, 73%)

CMYK

cmyk(0%, 59%, 62%, 27%)

Oklch

oklch(56.2% 0.142 25.8)

Traditional「Crimson」· Paint「Passion Red」· Creative Blush Sunrise

#692946

Dark Violet · Brown · Camellia

HEX

#692946

RGB

rgb(105, 41, 70)

HSL

hsl(333, 44%, 29%)

HSB

hsb(333, 61%, 41%)

CMYK

cmyk(0%, 61%, 33%, 59%)

Oklch

oklch(38.2% 0.098 354.4)

Traditional「Dark Violet」· Paint「Camellia」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

1F6061

61201F

Analogous

1F6141

1F6061

1F3F61

Triadic

1F6061

611F60

60611F

Split-Comp.

1F6061

611F3F

61411F

Tetradic

1F6061

411F61

61201F

3F611F

Contrast Matrix WCAG 2.1 Contrast

1F6061	BA9D72	DE9A66	BA4D47	692946
—	2.8 Fail	3.1 AA Large	1.5 Fail	1.4 Fail
2.8 Fail	—	1.1 Fail	1.9 Fail	4.1 AA Large
3.1 AA Large	1.1 Fail	—	2.1 Fail	4.4 AA Large
1.5 Fail	1.9 Fail	2.1 Fail	—	2.1 Fail
1.4 Fail	4.1 AA Large	4.4 AA Large	2.1 Fail	—

White BG

7.2AAA

2.6Fail

2.4Fail

5.0AA

10.5AAA

Black BG

2.9Fail

8.2AAA

8.9AAA

4.2AA Large

2.0Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

3B3C61

ADAD7C

C1C073

8B8A48

4D4D3F

Deuteranopia

373361

AFB17F

C5CA76

919949

51563D

Tritanopia

226161

B98586

DB7D7F

B54A4A

663938

Achromatopsia

4D4D4D

A1A1A1

A8A8A8

6D6D6D

3F3F3F

Shades & Tints Shades & Tints

#1F6061

Dark

Light

#BA9D72

Dark

Light

#DE9A66

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #1f6061;
  --color-2: #ba9d72;
  --color-3: #de9a66;
  --color-4: #ba4d47;
  --color-5: #692946;
}

SCSS

$color-1: #1f6061;
$color-2: #ba9d72;
$color-3: #de9a66;
$color-4: #ba4d47;
$color-5: #692946;

TAILWIND

colors: {
  'brand-1': '#1f6061',
  'brand-2': '#ba9d72',
  'brand-3': '#de9a66',
  'brand-4': '#ba4d47',
  'brand-5': '#692946',
}

RGB Array

[31, 96, 97], [186, 157, 114], [222, 154, 102], [186, 77, 71], [105, 41, 70]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This cool-style palette of #1F6061, #BA9D72, #DE9A66, #BA4D47, #692946 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: #1f6061; --color-2: #ba9d72; --color-3: #de9a66; --color-4: #ba4d47; --color-5: #692946. 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 cool-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