Cyan

Cool clarity and digital precision — cyan is the color of innovation.

Shades 11

Base #06b6d4

RGB 6, 182, 212

100

200

300

400

500

600

700

800

All Cyan Shades

Click any shade to copy the hex code instantly.

Usage in Code

CSS Variables

:root {
  --cyan-50: #ecfeff;
  --cyan-100: #cffafe;
  --cyan-200: #a5f3fc;
  --cyan-300: #67e8f9;
  --cyan-400: #22d3ee;
  --cyan-500: #06b6d4;
  --cyan-600: #0891b2;
  --cyan-700: #0e7490;
  --cyan-800: #155e75;
  --cyan-900: #164e63;
  --cyan-950: #083344;
}

Tailwind Config

// tailwind.config.js
module.exports = {
  theme: {
    extend: {
      colors: {
        cyan: {
          50: '#ecfeff',
          100: '#cffafe',
          200: '#a5f3fc',
          300: '#67e8f9',
          400: '#22d3ee',
          500: '#06b6d4',
          600: '#0891b2',
          700: '#0e7490',
          800: '#155e75',
          900: '#164e63',
          950: '#083344',
        },
      },
    },
  },
};

SCSS Map

$cyan-palette: (
  50: #ecfeff,
  100: #cffafe,
  200: #a5f3fc,
  300: #67e8f9,
  400: #22d3ee,
  500: #06b6d4,
  600: #0891b2,
  700: #0e7490,
  800: #155e75,
  900: #164e63,
  950: #083344,
);