Thistle

Muted and quietly beautiful — thistle carries the soft melancholy of wild meadows and faded watercolors.

Shades 11

Base #d8b4d8

RGB 216, 180, 216

100

200

300

400

500

600

700

800

All Thistle Shades

Click any shade to copy the hex code instantly.

Usage in Code

CSS Variables

:root {
  --thistle-50: #fdf8fd;
  --thistle-100: #f8ecf8;
  --thistle-200: #f0d9f0;
  --thistle-300: #e4c4e4;
  --thistle-400: #d8b4d8;
  --thistle-500: #bf8dbf;
  --thistle-600: #9a669a;
  --thistle-700: #744a74;
  --thistle-800: #503250;
  --thistle-900: #301e30;
  --thistle-950: #180f18;
}

Tailwind Config

// tailwind.config.js
module.exports = {
  theme: {
    extend: {
      colors: {
        thistle: {
          50: '#fdf8fd',
          100: '#f8ecf8',
          200: '#f0d9f0',
          300: '#e4c4e4',
          400: '#d8b4d8',
          500: '#bf8dbf',
          600: '#9a669a',
          700: '#744a74',
          800: '#503250',
          900: '#301e30',
          950: '#180f18',
        },
      },
    },
  },
};

SCSS Map

$thistle-palette: (
  50: #fdf8fd,
  100: #f8ecf8,
  200: #f0d9f0,
  300: #e4c4e4,
  400: #d8b4d8,
  500: #bf8dbf,
  600: #9a669a,
  700: #744a74,
  800: #503250,
  900: #301e30,
  950: #180f18,
);