#0FBDAB + #53AABD + #6BBCBD + #9DEA8C + #C4D769 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#0FBDAB

Mineral Blue · LightSeaGreen · Mint Ice

HEX

#0FBDAB

RGB

rgb(15, 189, 171)

HSL

hsl(174, 85%, 40%)

HSB

hsb(174, 92%, 74%)

CMYK

cmyk(92%, 0%, 10%, 26%)

Oklch

oklch(71.8% 0.126 182.9)

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

#53AABD

Slate Blue · CadetBlue · Lake Green

HEX

#53AABD

RGB

rgb(83, 170, 189)

HSL

hsl(191, 45%, 53%)

HSB

hsb(191, 56%, 74%)

CMYK

cmyk(56%, 10%, 0%, 26%)

Oklch

oklch(69.2% 0.088 213.9)

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

#6BBCBD

Slate Blue · MediumAquaMarine · Lake Green

HEX

#6BBCBD

RGB

rgb(107, 188, 189)

HSL

hsl(181, 38%, 58%)

HSB

hsb(181, 43%, 74%)

CMYK

cmyk(43%, 1%, 0%, 26%)

Oklch

oklch(74.4% 0.080 196.6)

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

#9DEA8C

Emerald · LightGreen · Apple Green

HEX

#9DEA8C

RGB

rgb(157, 234, 140)

HSL

hsl(109, 69%, 73%)

HSB

hsb(109, 40%, 92%)

CMYK

cmyk(33%, 0%, 40%, 8%)

Oklch

oklch(86.5% 0.147 140.0)

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

#C4D769

Willow Green · BurlyWood · Apple Green

HEX

#C4D769

RGB

rgb(196, 215, 105)

HSL

hsl(70, 58%, 63%)

HSB

hsb(70, 51%, 84%)

CMYK

cmyk(9%, 0%, 51%, 16%)

Oklch

oklch(84.2% 0.137 117.6)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

0FBDAB

BD0F21

Analogous

0FBD55

0FBDAB

0F77BD

Triadic

0FBDAB

AB0FBD

BDAB0F

Split-Comp.

0FBDAB

BD0F77

BD550F

Tetradic

0FBDAB

550FBD

BD0F21

77BD0F

Contrast Matrix WCAG 2.1 Contrast

0FBDAB	53AABD	6BBCBD	9DEA8C	C4D769
—	1.1 Fail	1.1 Fail	1.6 Fail	1.5 Fail
1.1 Fail	—	1.2 Fail	1.9 Fail	1.7 Fail
1.1 Fail	1.2 Fail	—	1.5 Fail	1.4 Fail
1.6 Fail	1.9 Fail	1.5 Fail	—	1.1 Fail
1.5 Fail	1.7 Fail	1.4 Fail	1.1 Fail	—

White BG

2.4Fail

2.7Fail

2.2Fail

1.4Fail

1.6Fail

Black BG

8.9AAA

7.9AAA

9.6AAA

14.6AAA

13.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

5A5CAF

7979B8

8E8FBD

BEBFA3

CCCC84

Deuteranopia

5043B0

746DB7

8983BD

BAB4A8

CBCA8A

Tritanopia

18B3B4

57B5B4

6FBDBD

A1B5B9

C5999D

Achromatopsia

878787

929292

A4A4A4

C8C8C8

C5C5C5

Shades & Tints Shades & Tints

#0FBDAB

Dark

Light

#53AABD

Dark

Light

#6BBCBD

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #0fbdab;
  --color-2: #53aabd;
  --color-3: #6bbcbd;
  --color-4: #9dea8c;
  --color-5: #c4d769;
}

SCSS

$color-1: #0fbdab;
$color-2: #53aabd;
$color-3: #6bbcbd;
$color-4: #9dea8c;
$color-5: #c4d769;

TAILWIND

colors: {
  'brand-1': '#0fbdab',
  'brand-2': '#53aabd',
  'brand-3': '#6bbcbd',
  'brand-4': '#9dea8c',
  'brand-5': '#c4d769',
}

RGB Array

[15, 189, 171], [83, 170, 189], [107, 188, 189], [157, 234, 140], [196, 215, 105]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #0FBDAB, #53AABD, #6BBCBD, #9DEA8C, #C4D769 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: #0fbdab; --color-2: #53aabd; --color-3: #6bbcbd; --color-4: #9dea8c; --color-5: #c4d769. 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