Start generating

Machinery to Muddy Rose color palette

A298AEMachinery608579Aloe Vera1D2F2AMarshlandFAEDE1Alpaca5B5169FreefallDBBEAEMuddy Rose
Open in generator Export PNG, PDF, ASE…

About this palette

Machinery to Muddy Rose is a 6-color muted palette: #A298AE (Machinery), #608579 (Aloe Vera), #1D2F2A (Marshland), #FAEDE1 (Alpaca), #5B5169 (Freefall), #DBBEAE (Muddy Rose). It mixes gray, turquoise, white, purple, orange tones and feels cool overall. The strongest text pairing is #1D2F2A on #FAEDE1 with a contrast ratio of 12.24:1, and 4 of its 15 color pairs pass WCAG AA for normal text.

Color codes

ColorHEXRGBHSL
Machineryrgb(162, 152, 174)hsl(267, 12%, 64%)
Aloe Verargb(96, 133, 121)hsl(161, 16%, 45%)
Marshlandrgb(29, 47, 42)hsl(163, 24%, 15%)
Alpacargb(250, 237, 225)hsl(29, 71%, 93%)
Freefallrgb(91, 81, 105)hsl(265, 13%, 36%)
Muddy Rosergb(219, 190, 174)hsl(21, 38%, 77%)

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.

  • Aa12.24:1 Super#1D2F2A on #FAEDE1
  • Aa12.24:1 Super#FAEDE1 on #1D2F2A
  • Aa8.03:1 Very good#1D2F2A on #DBBEAE
  • Aa8.03:1 Very good#DBBEAE on #1D2F2A
  • Aa6.46:1 Good#FAEDE1 on #5B5169
  • Aa6.46:1 Good#5B5169 on #FAEDE1
  • Aa5.12:1 Good#A298AE on #1D2F2A
  • Aa5.12:1 Good#1D2F2A on #A298AE

Color blindness preview

  • Protanopia
  • Deuteranopia
  • Tritanopia
  • Achromatopsia
  • Dog vision

CSS variables

/* Machinery to Muddy Rose — https://swatchly.xyz/palette/a298ae-608579-1d2f2a-faede1-5b5169-dbbeae */
:root {
  --machinery: #a298ae;
  --aloe-vera: #608579;
  --marshland: #1d2f2a;
  --alpaca: #faede1;
  --freefall: #5b5169;
  --muddy-rose: #dbbeae;
}

Tailwind CSS v4

/* Machinery to Muddy Rose — https://swatchly.xyz/palette/a298ae-608579-1d2f2a-faede1-5b5169-dbbeae */
@theme {
  --color-machinery: #a298ae;
  --color-machinery-50: #f6f1fe;
  --color-machinery-100: #ece5f4;
  --color-machinery-200: #d8d0e2;
  --color-machinery-300: #c1b9cc;
  --color-machinery-400: #a298ae;
  --color-machinery-500: #877e93;
  --color-machinery-600: #6e6478;
  --color-machinery-700: #574f61;
  --color-machinery-800: #453d4d;
  --color-machinery-900: #352f3c;
  --color-machinery-950: #211d27;
  --color-aloe-vera: #608579;
  --color-aloe-vera-50: #e3f9f1;
  --color-aloe-vera-100: #d5eee5;
  --color-aloe-vera-200: #bcdacf;
  --color-aloe-vera-300: #a0c2b7;
  --color-aloe-vera-400: #7da296;
  --color-aloe-vera-500: #608579;
  --color-aloe-vera-600: #496c61;
  --color-aloe-vera-700: #37564d;
  --color-aloe-vera-800: #29443c;
  --color-aloe-vera-900: #1e352e;
  --color-aloe-vera-950: #11221d;
  --color-marshland: #1d2f2a;
  --color-marshland-50: #ecf8f4;
  --color-marshland-100: #e1efea;
  --color-marshland-200: #cbdcd7;
  --color-marshland-300: #b3c6c0;
  --color-marshland-400: #91a59f;
  --color-marshland-500: #748882;
  --color-marshland-600: #596c66;
  --color-marshland-700: #43544f;
  --color-marshland-800: #303f3b;
  --color-marshland-900: #1d2f2a;
  --color-marshland-950: #131b19;
  --color-alpaca: #faede1;
  --color-alpaca-50: #fef7f1;
  --color-alpaca-100: #faede1;
  --color-alpaca-200: #e2d9d1;
  --color-alpaca-300: #ccc2b8;
  --color-alpaca-400: #ada197;
  --color-alpaca-500: #91857a;
  --color-alpaca-600: #756a60;
  --color-alpaca-700: #5d534a;
  --color-alpaca-800: #494139;
  --color-alpaca-900: #39312b;
  --color-alpaca-950: #231e19;
  --color-freefall: #5b5169;
  --color-freefall-50: #f7f2ff;
  --color-freefall-100: #eee7f9;
  --color-freefall-200: #dcd3e8;
  --color-freefall-300: #c6bcd4;
  --color-freefall-400: #a79db6;
  --color-freefall-500: #8c819b;
  --color-freefall-600: #716780;
  --color-freefall-700: #5b5169;
  --color-freefall-800: #473f52;
  --color-freefall-900: #373040;
  --color-freefall-950: #221d29;
  --color-muddy-rose: #dbbeae;
  --color-muddy-rose-50: #fff5ef;
  --color-muddy-rose-100: #fceae0;
  --color-muddy-rose-200: #ebd6ca;
  --color-muddy-rose-300: #dbbeae;
  --color-muddy-rose-400: #b99e90;
  --color-muddy-rose-500: #9d8273;
  --color-muddy-rose-600: #816759;
  --color-muddy-rose-700: #685144;
  --color-muddy-rose-800: #523e33;
  --color-muddy-rose-900: #3f2f25;
  --color-muddy-rose-950: #281c15;
}

Similar palettes