← Back to Editor

#0F9E9A · #FF58BA · #C80F6C · #FF661B · #A5B457

A 5-color palette palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicWarmCool

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial App

Color Details Color Details

#0F9E9A

Mineral Blue · LightSeaGreen · Mint Ice

HEX
#0F9E9A
RGB
rgb(15, 158, 154)
HSL
hsl(178, 83%, 34%)
HSB
hsb(178, 91%, 62%)
CMYK
cmyk(91%, 0%, 3%, 38%)
Oklch
oklch(63.3% 0.107 191.6)

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

#FF58BA

Mauve · Orchid · Rose Pink

HEX
#FF58BA
RGB
rgb(255, 88, 186)
HSL
hsl(325, 100%, 67%)
HSB
hsb(325, 65%, 100%)
CMYK
cmyk(0%, 65%, 27%, 0%)
Oklch
oklch(71.2% 0.223 348.0)

Traditional「Mauve」· Paint「Rose Pink」· Creative Rose Petal

#C80F6C

Dark Violet · MediumVioletRed · Camellia

HEX
#C80F6C
RGB
rgb(200, 15, 108)
HSL
hsl(330, 86%, 42%)
HSB
hsb(330, 93%, 78%)
CMYK
cmyk(0%, 93%, 46%, 22%)
Oklch
oklch(54.4% 0.215 359.4)

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

#FF661B

Tangerine · OrangeRed · Warm Sun

HEX
#FF661B
RGB
rgb(255, 102, 27)
HSL
hsl(20, 100%, 55%)
HSB
hsb(20, 89%, 100%)
CMYK
cmyk(0%, 60%, 89%, 0%)
Oklch
oklch(69.7% 0.202 41.6)

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

#A5B457

Grass Green · DarkSeaGreen · Olive Green

HEX
#A5B457
RGB
rgb(165, 180, 87)
HSL
hsl(70, 38%, 52%)
HSB
hsb(70, 52%, 71%)
CMYK
cmyk(8%, 0%, 52%, 29%)
Oklch
oklch(73.8% 0.120 117.0)

Traditional「Grass Green」· Paint「Olive Green」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

0F9E9A
9F0F14

Analogous

0F9F52
0F9E9A
0F5B9F

Triadic

0F9E9A
9A0F9F
9F9A0F

Split-Comp.

0F9E9A
9F0F5B
9F520F

Tetradic

0F9E9A
520F9F
9F0F14
5B9F0F

Contrast Matrix WCAG 2.1 Contrast

0F9E9A
FF58BA
C80F6C
FF661B
A5B457
—
1.2
Fail
1.7
Fail
1.1
Fail
1.5
Fail
1.2
Fail
—
2.0
Fail
1.0
Fail
1.3
Fail
1.7
Fail
2.0
Fail
—
1.9
Fail
2.5
Fail
1.1
Fail
1.0
Fail
1.9
Fail
—
1.3
Fail
1.5
Fail
1.3
Fail
2.5
Fail
1.3
Fail
—
White BG
3.3AA Large
2.9Fail
5.6AA
2.9Fail
2.3Fail
Black BG
6.4AA
7.4AAA
3.7AA Large
7.2AAA
9.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

4D4E9B
B7B5A2
787655
BDBB2D
ABAC6E

Deuteranopia

453A9B
C0CD9D
839150
C6D132
ABAA73

Tritanopia

169C9C
F7908B
BF4440
F73B3F
A67F83

Achromatopsia

737373
959595
515151
8B8B8B
A5A5A5

Shades & Tints Shades & Tints

#0F9E9A

Dark
Light

#FF58BA

Dark
Light

#C80F6C

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #0f9e9a;
  --color-2: #ff58ba;
  --color-3: #c80f6c;
  --color-4: #ff661b;
  --color-5: #a5b457;
}

SCSS

$color-1: #0f9e9a;
$color-2: #ff58ba;
$color-3: #c80f6c;
$color-4: #ff661b;
$color-5: #a5b457;

TAILWIND

colors: {
  'brand-1': '#0f9e9a',
  'brand-2': '#ff58ba',
  'brand-3': '#c80f6c',
  'brand-4': '#ff661b',
  'brand-5': '#a5b457',
}

RGB Array

[15, 158, 154], [255, 88, 186], [200, 15, 108], [255, 102, 27], [165, 180, 87]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #0F9E9A, #FF58BA, #C80F6C, #FF661B, #A5B457 is ideal for: social media posters, mobile apps, e-commerce promos. Vivid colors effectively attract user attention. It is a vibrant and energetic choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #0f9e9a; --color-2: #ff58ba; --color-3: #c80f6c; --color-4: #ff661b; --color-5: #a5b457. 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 food & dining, entertainment, kids education, social industries. Bold colors convey vitality and innovation. 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