Vermilion

Brilliant and ceremonial — vermilion blazes with the intensity of lacquer and ancient pigment.

Shades 11

Base #e34234

RGB 227, 66, 52

100

200

300

400

500

600

700

800

All Vermilion Shades

Click any shade to copy the hex code instantly.

Usage in Code

CSS Variables

:root {
  --vermilion-50: #fef3f1;
  --vermilion-100: #fde0db;
  --vermilion-200: #fbc1b7;
  --vermilion-300: #f7958a;
  --vermilion-400: #ee5f51;
  --vermilion-500: #e34234;
  --vermilion-600: #bd2f24;
  --vermilion-700: #92231b;
  --vermilion-800: #671813;
  --vermilion-900: #400e0b;
  --vermilion-950: #200706;
}

Tailwind Config

// tailwind.config.js
module.exports = {
  theme: {
    extend: {
      colors: {
        vermilion: {
          50: '#fef3f1',
          100: '#fde0db',
          200: '#fbc1b7',
          300: '#f7958a',
          400: '#ee5f51',
          500: '#e34234',
          600: '#bd2f24',
          700: '#92231b',
          800: '#671813',
          900: '#400e0b',
          950: '#200706',
        },
      },
    },
  },
};

SCSS Map

$vermilion-palette: (
  50: #fef3f1,
  100: #fde0db,
  200: #fbc1b7,
  300: #f7958a,
  400: #ee5f51,
  500: #e34234,
  600: #bd2f24,
  700: #92231b,
  800: #671813,
  900: #400e0b,
  950: #200706,
);