Chartreuse

Acid-bright and arresting — chartreuse is nature's most daring statement.

Shades 11

Base #7fff00

RGB 127, 255, 0

100

200

300

400

500

600

700

800

All Chartreuse Shades

Click any shade to copy the hex code instantly.

Usage in Code

CSS Variables

:root {
  --chartreuse-50: #f4ffe0;
  --chartreuse-100: #e5ffb5;
  --chartreuse-200: #ccff80;
  --chartreuse-300: #abff3d;
  --chartreuse-400: #7fff00;
  --chartreuse-500: #64cc00;
  --chartreuse-600: #4d9e00;
  --chartreuse-700: #397600;
  --chartreuse-800: #274f00;
  --chartreuse-900: #173000;
  --chartreuse-950: #0b1800;
}

Tailwind Config

// tailwind.config.js
module.exports = {
  theme: {
    extend: {
      colors: {
        chartreuse: {
          50: '#f4ffe0',
          100: '#e5ffb5',
          200: '#ccff80',
          300: '#abff3d',
          400: '#7fff00',
          500: '#64cc00',
          600: '#4d9e00',
          700: '#397600',
          800: '#274f00',
          900: '#173000',
          950: '#0b1800',
        },
      },
    },
  },
};

SCSS Map

$chartreuse-palette: (
  50: #f4ffe0,
  100: #e5ffb5,
  200: #ccff80,
  300: #abff3d,
  400: #7fff00,
  500: #64cc00,
  600: #4d9e00,
  700: #397600,
  800: #274f00,
  900: #173000,
  950: #0b1800,
);