Start generating

The Matrix to Frozen Landscape color palette

55E859The MatrixA3A800CountrysideE38D00Hotter ButterFFDECEGlazed SugarDF9EFFParty PigACE3FFFrozen Landscape
Open in generator Export PNG, PDF, ASE…

About this palette

The Matrix to Frozen Landscape is a 6-color light, neon palette: #55E859 (The Matrix), #A3A800 (Countryside), #E38D00 (Hotter Butter), #FFDECE (Glazed Sugar), #DF9EFF (Party Pig), #ACE3FF (Frozen Landscape). It mixes green, yellow, orange, purple, blue tones and feels balanced overall. The strongest text pairing is #E38D00 on #FFDECE with a contrast ratio of 2.05:1, and 0 of its 15 color pairs pass WCAG AA for normal text.

Color codes

ColorHEXRGBHSL
The Matrixrgb(85, 232, 89)hsl(122, 76%, 62%)
Countrysidergb(163, 168, 0)hsl(62, 100%, 33%)
Hotter Butterrgb(227, 141, 0)hsl(37, 100%, 45%)
Glazed Sugarrgb(255, 222, 206)hsl(20, 100%, 90%)
Party Pigrgb(223, 158, 255)hsl(280, 100%, 81%)
Frozen Landscapergb(172, 227, 255)hsl(200, 100%, 84%)

Accessible color pairs

Pairs with at least 3:1 contrast (large text and UI components); 4.5:1 or more passes WCAG AA for body text.

    Color blindness preview

    • Protanopia
    • Deuteranopia
    • Tritanopia
    • Achromatopsia
    • Dog vision

    CSS variables

    /* The Matrix to Frozen Landscape — https://swatchly.xyz/palette/55e859-a3a800-e38d00-ffdece-df9eff-ace3ff */
:root {
  --the-matrix: #55e859;
  --countryside: #a3a800;
  --hotter-butter: #e38d00;
  --glazed-sugar: #ffdece;
  --party-pig: #df9eff;
  --frozen-landscape: #ace3ff;
}

    Tailwind CSS v4

    /* The Matrix to Frozen Landscape — https://swatchly.xyz/palette/55e859-a3a800-e38d00-ffdece-df9eff-ace3ff */
@theme {
  --color-the-matrix: #55e859;
  --color-the-matrix-50: #e8ffe6;
  --color-the-matrix-100: #c9ffc7;
  --color-the-matrix-200: #96f694;
  --color-the-matrix-300: #55e859;
  --color-the-matrix-400: #35c53d;
  --color-the-matrix-500: #00a61c;
  --color-the-matrix-600: #008614;
  --color-the-matrix-700: #006a0e;
  --color-the-matrix-800: #005308;
  --color-the-matrix-900: #003f05;
  --color-the-matrix-950: #002802;
  --color-countryside: #a3a800;
  --color-countryside-50: #f5fbb8;
  --color-countryside-100: #ebf1a5;
  --color-countryside-200: #d8de81;
  --color-countryside-300: #c2c859;
  --color-countryside-400: #a3a800;
  --color-countryside-500: #878c00;
  --color-countryside-600: #6d7000;
  --color-countryside-700: #565900;
  --color-countryside-800: #434600;
  --color-countryside-900: #343600;
  --color-countryside-950: #202100;
  --color-hotter-butter: #e38d00;
  --color-hotter-butter-50: #fff4e8;
  --color-hotter-butter-100: #ffe8d0;
  --color-hotter-butter-200: #ffcf9d;
  --color-hotter-butter-300: #fcb15c;
  --color-hotter-butter-400: #e38d00;
  --color-hotter-butter-500: #bd7500;
  --color-hotter-butter-600: #995d00;
  --color-hotter-butter-700: #7a4900;
  --color-hotter-butter-800: #603900;
  --color-hotter-butter-900: #4a2b00;
  --color-hotter-butter-950: #301900;
  --color-glazed-sugar: #ffdece;
  --color-glazed-sugar-50: #ffece3;
  --color-glazed-sugar-100: #ffdece;
  --color-glazed-sugar-200: #e6cdc1;
  --color-glazed-sugar-300: #d3b7a9;
  --color-glazed-sugar-400: #b59889;
  --color-glazed-sugar-500: #9b7d6f;
  --color-glazed-sugar-600: #806456;
  --color-glazed-sugar-700: #684f42;
  --color-glazed-sugar-800: #533d32;
  --color-glazed-sugar-900: #412e25;
  --color-glazed-sugar-950: #291c15;
  --color-party-pig: #df9eff;
  --color-party-pig-50: #f9eeff;
  --color-party-pig-100: #f4dfff;
  --color-party-pig-200: #eac2ff;
  --color-party-pig-300: #df9eff;
  --color-party-pig-400: #be81dc;
  --color-party-pig-500: #a365c1;
  --color-party-pig-600: #884ba4;
  --color-party-pig-700: #6f3788;
  --color-party-pig-800: #59286f;
  --color-party-pig-900: #471c59;
  --color-party-pig-950: #2d0f3b;
  --color-frozen-landscape: #ace3ff;
  --color-frozen-landscape-50: #edf9ff;
  --color-frozen-landscape-100: #d9f2ff;
  --color-frozen-landscape-200: #ace3ff;
  --color-frozen-landscape-300: #9dcae2;
  --color-frozen-landscape-400: #78abc5;
  --color-frozen-landscape-500: #5b8fa9;
  --color-frozen-landscape-600: #41748c;
  --color-frozen-landscape-700: #2c5c72;
  --color-frozen-landscape-800: #1d485b;
  --color-frozen-landscape-900: #133748;
  --color-frozen-landscape-950: #08222e;
}

    Similar palettes