#299E98 + #5D9691 + #6E8F89 + #8C8C74 + #B09031 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#299E98

Mineral Blue · LightSeaGreen · Mint Ice

HEX

#299E98

RGB

rgb(41, 158, 152)

HSL

hsl(177, 59%, 39%)

HSB

hsb(177, 74%, 62%)

CMYK

cmyk(74%, 0%, 4%, 38%)

Oklch

oklch(63.6% 0.100 189.8)

Traditional「Mineral Blue」· Paint「Mint Ice」· Creative Blush Sunrise

#5D9691

Mineral Blue · CadetBlue · Mint Ice

HEX

#5D9691

RGB

rgb(93, 150, 145)

HSL

hsl(175, 23%, 48%)

HSB

hsb(175, 38%, 59%)

CMYK

cmyk(38%, 0%, 3%, 41%)

Oklch

oklch(63.2% 0.061 188.7)

Traditional「Mineral Blue」· Paint「Mint Ice」· Creative Blush Sunrise

#6E8F89

Mineral Blue · SlateGray · Mint Ice

HEX

#6E8F89

RGB

rgb(110, 143, 137)

HSL

hsl(169, 13%, 50%)

HSB

hsb(169, 23%, 56%)

CMYK

cmyk(23%, 0%, 4%, 44%)

Oklch

oklch(62.3% 0.038 182.7)

Traditional「Mineral Blue」· Paint「Mint Ice」· Creative Blush Sunrise

#8C8C74

Autumn Sage · Gray · Warm Gray

HEX

#8C8C74

RGB

rgb(140, 140, 116)

HSL

hsl(60, 9%, 50%)

HSB

hsb(60, 17%, 55%)

CMYK

cmyk(0%, 0%, 17%, 45%)

Oklch

oklch(63.3% 0.035 107.3)

Traditional「Autumn Sage」· Paint「Warm Gray」· Creative Urban Concrete

#B09031

Ochre · DarkGoldenRod · Honey Gold

HEX

#B09031

RGB

rgb(176, 144, 49)

HSL

hsl(45, 56%, 44%)

HSB

hsb(45, 72%, 69%)

CMYK

cmyk(0%, 18%, 72%, 31%)

Oklch

oklch(66.6% 0.117 89.8)

Traditional「Ochre」· Paint「Honey Gold」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

299E98

9E292F

Analogous

299E5E

299E98

29699E

Triadic

299E98

98299E

9E9829

Split-Comp.

299E98

9E2969

9E5E29

Tetradic

299E98

5E299E

9E292F

699E29

Contrast Matrix WCAG 2.1 Contrast

299E98	5D9691	6E8F89	8C8C74	B09031
—	1.0 Fail	1.1 Fail	1.1 Fail	1.1 Fail
1.0 Fail	—	1.0 Fail	1.0 Fail	1.1 Fail
1.1 Fail	1.0 Fail	—	1.0 Fail	1.2 Fail
1.1 Fail	1.0 Fail	1.0 Fail	—	1.1 Fail
1.1 Fail	1.1 Fail	1.2 Fail	1.1 Fail	—

White BG

3.3AA Large

3.4AA Large

3.5AA Large

3.4AA Large

3.1AA Large

Black BG

6.4AA

6.2AA

6.0AA

6.1AA

6.9AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

5C5D99

767692

7C7D8A

8C8C7A

A2A248

Deuteranopia

554C9A

726E93

7A788B

8C8C7B

A4A64E

Tritanopia

2F9B9B

609393

708C8C

8C7E7F

AE5A5E

Achromatopsia

7A7A7A

848484

898989

8F8F8F

Shades & Tints Shades & Tints

#299E98

Dark

Light

#5D9691

Dark

Light

#6E8F89

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #299e98;
  --color-2: #5d9691;
  --color-3: #6e8f89;
  --color-4: #8c8c74;
  --color-5: #b09031;
}

SCSS

$color-1: #299e98;
$color-2: #5d9691;
$color-3: #6e8f89;
$color-4: #8c8c74;
$color-5: #b09031;

TAILWIND

colors: {
  'brand-1': '#299e98',
  'brand-2': '#5d9691',
  'brand-3': '#6e8f89',
  'brand-4': '#8c8c74',
  'brand-5': '#b09031',
}

RGB Array

[41, 158, 152], [93, 150, 145], [110, 143, 137], [140, 140, 116], [176, 144, 49]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #299E98, #5D9691, #6E8F89, #8C8C74, #B09031 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: #299e98; --color-2: #5d9691; --color-3: #6e8f89; --color-4: #8c8c74; --color-5: #b09031. 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 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