← Back to Editor

#746359 · #CCE0E0 · #FFFEDE · #4FB2C9

earth

A 4-color earth palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReadingData Visualization

Color Details Color Details

#746359

Tangerine · DimGray · Amber Brown

HEX
#746359
RGB
rgb(116, 99, 89)
HSL
hsl(22, 13%, 40%)
HSB
hsb(22, 23%, 45%)
CMYK
cmyk(0%, 15%, 23%, 55%)
Oklch
oklch(51.3% 0.027 52.3)

Traditional「Tangerine」· Paint「Amber Brown」· Creative Blush Sunrise

#CCE0E0

Sky Blue · LightGray · Glacier Blue

HEX
#CCE0E0
RGB
rgb(204, 224, 224)
HSL
hsl(180, 24%, 84%)
HSB
hsb(180, 9%, 88%)
CMYK
cmyk(9%, 0%, 0%, 12%)
Oklch
oklch(89.2% 0.021 196.8)

Traditional「Sky Blue」· Paint「Glacier Blue」· Creative Arctic Pool

#FFFEDE

Fresh Green · LightYellow · Lemon Cream

HEX
#FFFEDE
RGB
rgb(255, 254, 222)
HSL
hsl(58, 100%, 94%)
HSB
hsb(58, 13%, 100%)
CMYK
cmyk(0%, 0%, 13%, 0%)
Oklch
oklch(99.0% 0.042 105.7)

Traditional「Fresh Green」· Paint「Lemon Cream」· Creative Lemon Fizz

#4FB2C9

Lake Blue · MediumTurquoise · Lake Green

HEX
#4FB2C9
RGB
rgb(79, 178, 201)
HSL
hsl(191, 53%, 55%)
HSB
hsb(191, 61%, 79%)
CMYK
cmyk(61%, 11%, 0%, 21%)
Oklch
oklch(71.4% 0.097 215.5)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

746359
596A73

Analogous

73595C
746359
737059

Triadic

746359
597362
625973

Split-Comp.

746359
597370
595C73

Tetradic

746359
5C7359
596A73
705973

Contrast Matrix WCAG 2.1 Contrast

746359
CCE0E0
FFFEDE
4FB2C9
—
4.2
AA Large
5.6
AA
2.3
Fail
4.2
AA Large
—
1.3
Fail
1.8
Fail
5.6
AA
1.3
Fail
—
2.4
Fail
2.3
Fail
1.8
Fail
2.4
Fail
—
White BG
5.7AA
1.4Fail
1.0Fail
2.5Fail
Black BG
3.7AA Large
15.3AAA
20.5AAA
8.5AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

6D6C5B
D5D5E0
FFFFE6
7A7BC3

Deuteranopia

6E6F5C
D4D2E0
FFFFE8
746DC2

Tritanopia

735D5E
CDE0E0
FFECED
54BFBE

Achromatopsia

676767
DADADA
FBFBFB
979797

Shades & Tints Shades & Tints

#746359

Dark
Light

#CCE0E0

Dark
Light

#FFFEDE

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #746359;
  --color-2: #cce0e0;
  --color-3: #fffede;
  --color-4: #4fb2c9;
}

SCSS

$color-1: #746359;
$color-2: #cce0e0;
$color-3: #fffede;
$color-4: #4fb2c9;

TAILWIND

colors: {
  'brand-1': '#746359',
  'brand-2': '#cce0e0',
  'brand-3': '#fffede',
  'brand-4': '#4fb2c9',
}

RGB Array

[116, 99, 89], [204, 224, 224], [255, 254, 222], [79, 178, 201]

FAQ FAQ

What scenarios is this 4-color palette suitable for?

This earth-style palette of #746359, #CCE0E0, #FFFEDE, #4FB2C9 is ideal for: health products, baby brands, fresh-style blogs, infographics, data visualization, accessible design. High contrast ensures clear visual hierarchy and readability. It is a balanced and harmonious choice among 4-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #746359; --color-2: #cce0e0; --color-3: #fffede; --color-4: #4fb2c9. 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?

Light tones suit backgrounds; use dark colors for body text. Mid-tones work for card backgrounds or dividers to add depth. 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 earth-style 4-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