CSS Gradient Text Generator

Design text with customizable color gradients - choose from linear or radial styles, adjust colors, fonts, and sizes, add animations, and get instant CSS/Tailwind code. Perfect for creating modern website headings, logos, and modern text effects with real-time preview.

.gradient-text {
  font-size: 48px;
  font-family: inherit;
  font-weight: normal;
  font-style: normal;
  background-image: linear-gradient(45deg, #FF512F, #F09819);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  
}