Generate Palette
  1. Colors palettes
  2. Atomic Design Token Panel
Created at 07/08/2025 20:36
byraccoon
  1

Atomic Design Token Panel

  • Molecule Teal
    #38b6ff
  • Nucleus Gray
    #dfe0e2
  • System Rose
    #fdcbdf
  • Base Ink
    #222222
  • Atom White
    #fdfdfd
The palette consists of Light, Dark colors. Accent colors Molecule Teal #38b6ff and System Rose #fdcbdf. Palette has Cool, Neutral colors temperature.

By lightness, this palette runs from #222222 (darkest) to #FDFDFD (lightest). The lightness range is wide.

Overall saturation feels mostly muted (lower chroma).

Most swatches are near-neutral or very low-chroma, so hue relationships are subtle.

Most swatches read as neutral in color temperature.

HEX codes (sorted): #222222, #38B6FF, #DFE0E2, #FDCBDF, #FDFDFD

Palette Atomic Design Token Panel has combination of 5 codes colors:
HEX: #38b6ff, RGB: (56, 182, 255); HEX: #dfe0e2, RGB: (223, 224, 226); HEX: #fdcbdf, RGB: (253, 203, 223)
HEX: #222222, RGB: (34, 34, 34); HEX: #fdfdfd, RGB: (253, 253, 253)
Simplified version of palette colors
Shade of deepskyblue, Shade of gainsboro, Shade of Pink, Shade of Black, Tint of White
Color scheme was created by raccoon

Colors codes in palette

Atomic Design Token Panel color codes HEX, RGB information in table

Color HEX RGB Name Alternative name
#38b6ff #38b6ff RGB(56, 182, 255)Molecule Teal—
#dfe0e2 #dfe0e2 RGB(223, 224, 226)Nucleus Gray—
#fdcbdf #fdcbdf RGB(253, 203, 223)System Rose—
#222222 #222222 RGB(34, 34, 34)Base InkBlack Out
#fdfdfd #fdfdfd RGB(253, 253, 253)Atom WhiteBrilliance

Color Palette Contrast

5 color pairs have low contrast and need improvement which may impact readability.
Text Color Background Color Contrast Ratio
#38b6ff
#dfe0e2
1.7
#38b6ff
#fdcbdf
1.58
#dfe0e2
#fdcbdf
1.07
#dfe0e2
#fdfdfd
1.29
#fdcbdf
#fdfdfd
1.39

Image palette Atomic Design Token Panel png

Atomic Design Token Panel - #554448
 Download image