Gradient Text Generator

Create CSS gradient text effects.

Gradient

Text

Color 1

Color 2

Angle: 90°

CSS

background: linear-gradient(90deg, #12403c, #c98a1e);
-webkit-background-clip: text;
background-clip: text;
color: transparent;

About this tool

Free gradient text generator. Pick colors to create eye-catching CSS gradient text and copy the ready-to-use code — for headings and hero sections.