#297C74 + #30D7BB + #27BCA0 + #23B1AD + #6E9996 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#297C74

Mineral Blue · SeaGreen · Mint Ice

HEX

#297C74

RGB

rgb(41, 124, 116)

HSL

hsl(174, 50%, 32%)

HSB

hsb(174, 67%, 49%)

CMYK

cmyk(67%, 0%, 6%, 51%)

Oklch

oklch(53.5% 0.079 186.0)

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

#30D7BB

Mineral Blue · Turquoise · Lake Green

HEX

#30D7BB

RGB

rgb(48, 215, 187)

HSL

hsl(170, 68%, 52%)

HSB

hsb(170, 78%, 84%)

CMYK

cmyk(78%, 0%, 13%, 16%)

Oklch

oklch(79.1% 0.136 178.1)

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

#27BCA0

Mineral Blue · LightSeaGreen · Mint Ice

HEX

#27BCA0

RGB

rgb(39, 188, 160)

HSL

hsl(169, 66%, 45%)

HSB

hsb(169, 79%, 74%)

CMYK

cmyk(79%, 0%, 15%, 26%)

Oklch

oklch(71.4% 0.126 176.1)

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

#23B1AD

Mineral Blue · LightSeaGreen · Mint Ice

HEX

#23B1AD

RGB

rgb(35, 177, 173)

HSL

hsl(178, 67%, 42%)

HSB

hsb(178, 80%, 69%)

CMYK

cmyk(80%, 0%, 2%, 31%)

Oklch

oklch(69.0% 0.112 191.9)

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

#6E9996

Mineral Blue · CadetBlue · Lake Green

HEX

#6E9996

RGB

rgb(110, 153, 150)

HSL

hsl(176, 17%, 52%)

HSB

hsb(176, 28%, 60%)

CMYK

cmyk(28%, 0%, 2%, 40%)

Oklch

oklch(65.1% 0.047 190.7)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

297C74

7A2931

Analogous

297A49

297C74

295A7A

Triadic

297C74

72297A

7A7229

Split-Comp.

297C74

7A295A

7A4929

Tetradic

297C74

49297A

7A2931

5A7A29

Contrast Matrix WCAG 2.1 Contrast

297C74	30D7BB	27BCA0	23B1AD	6E9996
—	2.7 Fail	2.1 Fail	1.9 Fail	1.6 Fail
2.7 Fail	—	1.3 Fail	1.5 Fail	1.7 Fail
2.1 Fail	1.3 Fail	—	1.1 Fail	1.3 Fail
1.9 Fail	1.5 Fail	1.1 Fail	—	1.2 Fail
1.6 Fail	1.7 Fail	1.3 Fail	1.2 Fail	—

White BG

5.0AA

1.8Fail

2.4Fail

2.6Fail

3.2AA Large

Black BG

4.2AA Large

11.6AAA

8.8AAA

8.0AAA

6.7AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

4D4E76

787AC2

6869A7

6062AE

818197

Deuteranopia

484276

6F62C3

5F54A8

584EAE

7E7B97

Tritanopia

2D7778

38C7C8

2EACAD

2AAFAF

709797

Achromatopsia

626262

A2A2A2

8C8C8C

868686

8C8C8C

Shades & Tints Shades & Tints

#297C74

Dark

Light

#30D7BB

Dark

Light

#27BCA0

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #297c74;
  --color-2: #30d7bb;
  --color-3: #27bca0;
  --color-4: #23b1ad;
  --color-5: #6e9996;
}

SCSS

$color-1: #297c74;
$color-2: #30d7bb;
$color-3: #27bca0;
$color-4: #23b1ad;
$color-5: #6e9996;

TAILWIND

colors: {
  'brand-1': '#297c74',
  'brand-2': '#30d7bb',
  'brand-3': '#27bca0',
  'brand-4': '#23b1ad',
  'brand-5': '#6e9996',
}

RGB Array

[41, 124, 116], [48, 215, 187], [39, 188, 160], [35, 177, 173], [110, 153, 150]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #297C74, #30D7BB, #27BCA0, #23B1AD, #6E9996 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: #297c74; --color-2: #30d7bb; --color-3: #27bca0; --color-4: #23b1ad; --color-5: #6e9996. 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