← Back to Editor

#7BDABA · #FDF3E9 · #FA4D4F · #0A425D · #F4C869

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 AppData Visualization

Color Details Color Details

#7BDABA

Jade · MediumAquaMarine · Lake Green

HEX
#7BDABA
RGB
rgb(123, 218, 186)
HSL
hsl(160, 56%, 67%)
HSB
hsb(160, 44%, 85%)
CMYK
cmyk(44%, 0%, 15%, 15%)
Oklch
oklch(82.1% 0.102 169.9)

Traditional「Jade」· Paint「Lake Green」· Creative Arctic Pool

#FDF3E9

Goose Yellow · Linen · Peach Orange

HEX
#FDF3E9
RGB
rgb(253, 243, 233)
HSL
hsl(30, 83%, 95%)
HSB
hsb(30, 8%, 99%)
CMYK
cmyk(0%, 4%, 8%, 1%)
Oklch
oklch(96.9% 0.017 67.6)

Traditional「Goose Yellow」· Paint「Peach Orange」· Creative Honey Glow

#FA4D4F

Peach Pink · Tomato · Coral Red

HEX
#FA4D4F
RGB
rgb(250, 77, 79)
HSL
hsl(359, 95%, 64%)
HSB
hsb(359, 69%, 98%)
CMYK
cmyk(0%, 69%, 68%, 2%)
Oklch
oklch(66.5% 0.209 24.3)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Rose Petal

#0A425D

Lake Blue · DarkSlateGray · Deep Sea Blue

HEX
#0A425D
RGB
rgb(10, 66, 93)
HSL
hsl(200, 81%, 20%)
HSB
hsb(200, 89%, 36%)
CMYK
cmyk(89%, 29%, 0%, 64%)
Oklch
oklch(35.9% 0.071 235.8)

Traditional「Lake Blue」· Paint「Deep Sea Blue」· Creative Blush Sunrise

#F4C869

Ginger · SandyBrown · Sunflower

HEX
#F4C869
RGB
rgb(244, 200, 105)
HSL
hsl(41, 86%, 68%)
HSB
hsb(41, 57%, 96%)
CMYK
cmyk(0%, 18%, 57%, 4%)
Oklch
oklch(85.3% 0.124 84.8)

Traditional「Ginger」· Paint「Sunflower」· Creative Lemon Fizz

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

7BDABA
DA7C9B

Analogous

7CDA8B
7BDABA
7CCADA

Triadic

7BDABA
BB7CDA
DABB7C

Split-Comp.

7BDABA
DA7CCA
DA8B7C

Tetradic

7BDABA
8B7CDA
DA7C9B
CADA7C

Contrast Matrix WCAG 2.1 Contrast

7BDABA
FDF3E9
FA4D4F
0A425D
F4C869
—
1.5
Fail
2.0
Fail
6.5
AA
1.1
Fail
1.5
Fail
—
3.1
AA Large
9.8
AAA
1.4
Fail
2.0
Fail
3.1
AA Large
—
3.2
AA Large
2.1
Fail
6.5
AA
9.8
AAA
3.2
AA Large
—
6.8
AA
1.1
Fail
1.4
Fail
2.1
Fail
6.8
AA
—
White BG
1.7Fail
1.1Fail
3.4AA Large
10.8AAA
1.6Fail
Black BG
12.6AAA
19.2AAA
6.2AA
2.0Fail
13.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

A4A5C2
F9F9EB
AFAE4F
222356
E1E180

Deuteranopia

9F98C4
F9FAEC
B9C64E
1F1B55
E4E786

Tritanopia

80C8C9
FDEDEE
F14E4E
0D5150
F29296

Achromatopsia

BABABA
F5F5F5
818181
343434
CACACA

Shades & Tints Shades & Tints

#7BDABA

Dark
Light

#FDF3E9

Dark
Light

#FA4D4F

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #7bdaba;
  --color-2: #fdf3e9;
  --color-3: #fa4d4f;
  --color-4: #0a425d;
  --color-5: #f4c869;
}

SCSS

$color-1: #7bdaba;
$color-2: #fdf3e9;
$color-3: #fa4d4f;
$color-4: #0a425d;
$color-5: #f4c869;

TAILWIND

colors: {
  'brand-1': '#7bdaba',
  'brand-2': '#fdf3e9',
  'brand-3': '#fa4d4f',
  'brand-4': '#0a425d',
  'brand-5': '#f4c869',
}

RGB Array

[123, 218, 186], [253, 243, 233], [250, 77, 79], [10, 66, 93], [244, 200, 105]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #7BDABA, #FDF3E9, #FA4D4F, #0A425D, #F4C869 is ideal for: social media posters, mobile apps, e-commerce promos, infographics, data visualization, accessible design. Vivid colors effectively attract user attention. High contrast ensures clear visual hierarchy and readability. 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: #7bdaba; --color-2: #fdf3e9; --color-3: #fa4d4f; --color-4: #0a425d; --color-5: #f4c869. 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. High-contrast palettes naturally meet WCAG accessibility standards. 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