Steel Blue Fade Gradient: CSS Code & Colors

Q: What's the CSS code for the Steel Blue Fade gradient?

Use background: linear-gradient(0deg, #1E3C72 0%, #2A5298 100%);. RGBA and HSLA versions are also available on this page.

Steel Blue Fade Gradient

Cool, corporate-friendly navy-to-blue gradient.

Customize this gradient →

Opens it in the generator: change the type or direction, adjust the colors, then copy the CSS or download.

Color Stops

#1E3C72

#2A5298

Steel Blue Fade CSS Code

background: #1E3C72;
background: linear-gradient(0deg, #1E3C72 0%, #2A5298 100%);

background: rgba(30, 60, 114, 1.0);
background: linear-gradient(0deg, rgba(30, 60, 114, 1.0) 0%, rgba(42, 82, 152, 1.0) 100%);

background: hsla(219, 58%, 28%, 1.0);
background: linear-gradient(0deg, hsla(219, 58%, 28%, 1.0) 0%, hsla(218, 57%, 38%, 1.0) 100%);

background: #1E3C72;
background: linear-gradient(0deg, #1E3C72 0%, #2A5298 100%);
background: linear-gradient(0deg in oklch, oklch(36.43% 0.0998 261.1) 0%, oklch(44.81% 0.1232 260.71) 100%);

The same colors blended in OKLCH, so this one looks more vivid than the gradient above. Older browsers show the standard gradient. How OKLCH gradients work →

bg-linear-0/srgb from-[#1E3C72] from-0% to-[#2A5298] to-100%

bg-gradient-to-t from-[#1E3C72] from-0% to-[#2A5298] to-100%

Try it as

Similar Gradients

More Gradient Presets

FAQ

What is the Steel Blue Fade gradient?