ColorSeed

Complementary · 8 colors · April 27, 2026

Cloud & Jade

Create palette

Built on the sophistication of a broken complement — tension without brutality, Cloud & Jade unfolds a space of quiet contemplation. an uncompromising visual dramaturgy — an invitation to clarity and openness.

ComplementaryIllustrationFashionBoldCoolOcean
#65E6E6Couleur 1
RGB101 230 230HSL180 72 65
#FCE9FBCouleur 2
RGB252 233 251HSL303 76 95
#E6B565Couleur 3
RGB230 181 101HSL37 72 65
#22D0D3Couleur 4
RGB34 208 211HSL181 72 48
#9B5998Couleur 5
RGB155 89 152HSL303 27 48
#881816Couleur 6
RGB136 24 22HSL1 72 31
#0E5153Couleur 7
RGB14 81 83HSL182 71 19
#510E53Couleur 8
RGB81 14 83HSL298 71 19

Palette Usage Guide

Application Scenarios

Interface Design

Combine #510e53 for text on #fce9fb background.

Emotional Impact

Built on the sophistication of a broken complement — tension without brutality, Cloud & Jade unfolds a space of quiet contemplation. an uncompromising visual dramaturgy — an invitation to clarity and openness.

Contrast Analysis
Text on Canvas

11.8:1

AAA

Secondary on Canvas

1.6:1

Fail

Accent on Base

7.2:1

AAA

Convert palette to thread / yarn

Closest matches across major brands

Average ΔE :57 (Rough)
#65E6E6
DMC 598
Turquoise Lt
ΔE 99
#FCE9FB
DMC 3865
Winter White
ΔE 31
#E6B565
DMC 3821
Straw
ΔE 24
#22D0D3
DMC 959
Sea Green Med
ΔE 126
#9B5998
DMC 209
Lavender Dk
ΔE 47
#881816
DMC 816
Garnet
ΔE 35
#0E5153
DMC 501
Blue Green Dk
ΔE 50
#510E53
DMC 550
Violet Vy Dk
ΔE 40

Approximate sRGB matches — request a physical color card from each brand before purchasing.

Technical Specs

Developer Assets

Developer handoff assets with copyable code blocks for design systems.

CSS
:root {
  --color-couleur-1: #65e6e6;
  --color-couleur-2: #fce9fb;
  --color-couleur-3: #e6b565;
  --color-couleur-4: #22d0d3;
  --color-couleur-5: #9b5998;
  --color-couleur-6: #881816;
  --color-couleur-7: #0e5153;
  --color-couleur-8: #510e53;
}
Tailwind
'cloud-jade': {
  800: '#65e6e6',
  700: '#fce9fb',
  600: '#e6b565',
  500: '#22d0d3',
  400: '#9b5998',
  300: '#881816',
  200: '#0e5153',
  100: '#510e53',
}
JSON
{
  "name": "Cloud & Jade",
  "harmony": "Complementary",
  "colors": [
    {
      "name": "Couleur 1",
      "hex": "#65e6e6"
    },
    {
      "name": "Couleur 2",
      "hex": "#fce9fb"
    },
    {
      "name": "Couleur 3",
      "hex": "#e6b565"
    },
    {
      "name": "Couleur 4",
      "hex": "#22d0d3"
    },
    {
      "name": "Couleur 5",
      "hex": "#9b5998"
    },
    {
      "name": "Couleur 6",
      "hex": "#881816"
    },
    {
      "name": "Couleur 7",
      "hex": "#0e5153"
    },
    {
      "name": "Couleur 8",
      "hex": "#510e53"
    }
  ]
}
Export Image
Design Tokens

Design Tokens Export

W3C, Figma and Tokens Studio compatible. Direct integration into your design workflow.

Go Pro
Accessibility

Contrast Ratios

Each color vs. white background

Couleur 1
White
1.5:1Fail
Black
14.01:1AAA
Couleur 2
White
1.15:1Fail
Black
18.19:1AAA
Couleur 3
White
1.88:1Fail
Black
11.16:1AAA
Couleur 4
White
1.9:1Fail
Black
11.03:1AAA
Couleur 5
White
4.91:1AA
Black
4.28:1AA Large
Couleur 6
White
9.59:1AAA
Black
2.19:1Fail
Couleur 7
White
9.05:1AAA
Black
2.32:1Fail
Couleur 8
White
13.66:1AAA
Black
1.54:1Fail
Brand Design

Identity Visuals

Icon Application
Typography Pairing

Cloud & Jade

The intersection of form and function reveals the palette in all its depth. Every hue is intentional, every space is a breath.

· Display · Body
UI Components
Buttons
Active

Surface Card

System element

Emotional Resonance

Color Psychology

Couleur 1

Freshness & Clarity

Couleur 1 radiates the invigorating clarity of tropical waters — a light, rich hue at the boundary of blue and green. Its clarity brings freshness and trust simultaneously — the signal of a brand that is both modern and caring.

FreshnessClarityModernityTrust
Couleur 2

Creativity & Distinction

Couleur 2 radiates the pale, rich register of violet — a color rare in nature that, for this very reason, instantly draws the eye. Its vibrancy makes it a remarkable distinction tool in a landscape dominated by blues and grays. It embodies creative ambition and unconventional thinking.

CreativityDistinctionAmbitionOriginality
Couleur 3

Warmth & Benevolence

Couleur 3 radiates the light, rich warmth of fired clay — a shade that is both reassuring and memorable. In its lighter tones, it sheds the heaviness of saturated orange to gain accessibility and human closeness.

ClosenessWarmthBenevolenceLifestyle
Couleur 4

Freshness & Clarity

Couleur 4 evokes the invigorating clarity of tropical waters — a medium, rich hue at the boundary of blue and green. Its clarity brings freshness and trust simultaneously — the signal of a brand that is both modern and caring.

FreshnessClarityModernityTrust
Couleur 5

Elegance & Subtlety

Couleur 5 evokes the medium, quiet register of violet — a color rare in nature that, for this very reason, instantly draws the eye. Its softened hue slides between originality and quiet elegance — the color of brands that know their worth without shouting it.

EleganceSubtletyRefinementDiscernment
Couleur 6

Authority & Mastery

Couleur 6 is a dark, rich red that commands a raw and memorable intensity. Its depth lends the gravity of brands that have nothing to justify — quiet power, total assurance.

AuthorityDepthPrestigeGravity
Couleur 7

Depth & Mystery

Couleur 7 commands the silent depth of the ocean floor — a deep, rich hue at the boundary of blue and green. Rare and sophisticated, it evokes a quiet wisdom and accessible mystery. It commands without aggression.

MysteryDepthWisdomSophistication
Couleur 8

Royalty & Mystery

Couleur 8 commands the deep, rich register of violet — a color rare in nature that, for this very reason, instantly draws the eye. Its roots in royal tradition give it an aura of rarity and power. It etches itself in memory effortlessly.

RoyaltyMysteryRarityPower
Visual Atmosphere

Moodboard

No images found

Export

Brand PDF

Premium Brand Guidelines document with palette, color psychology and moodboard.

PDF Brand Identity Export

7 premium pages: Cover · Palette · Detail · Typography · Usage Guide

Go Pro
Create your own palette on ColorSeed →