Steel Blue

Industrial strength and cool precision — steel blue is the color of modern infrastructure and quiet resolve.

Shades 11

Base #4682b4

RGB 70, 130, 180

100

200

300

400

500

600

700

800

All Steel Blue Shades

Click any shade to copy the hex code instantly.

Usage in Code

CSS Variables

:root {
  --steel-blue-50: #f0f5fb;
  --steel-blue-100: #dce8f5;
  --steel-blue-200: #b8d1eb;
  --steel-blue-300: #88b4da;
  --steel-blue-400: #5e96c5;
  --steel-blue-500: #4682b4;
  --steel-blue-600: #376896;
  --steel-blue-700: #2a5073;
  --steel-blue-800: #1d3852;
  --steel-blue-900: #112132;
  --steel-blue-950: #081019;
}

Tailwind Config

// tailwind.config.js
module.exports = {
  theme: {
    extend: {
      colors: {
        steel-blue: {
          50: '#f0f5fb',
          100: '#dce8f5',
          200: '#b8d1eb',
          300: '#88b4da',
          400: '#5e96c5',
          500: '#4682b4',
          600: '#376896',
          700: '#2a5073',
          800: '#1d3852',
          900: '#112132',
          950: '#081019',
        },
      },
    },
  },
};

SCSS Map

$steel-blue-palette: (
  50: #f0f5fb,
  100: #dce8f5,
  200: #b8d1eb,
  300: #88b4da,
  400: #5e96c5,
  500: #4682b4,
  600: #376896,
  700: #2a5073,
  800: #1d3852,
  900: #112132,
  950: #081019,
);