Create stunning gradient text with CSS - pick colors, adjust direction, preview live, and copy the CSS or Tailwind code.
background: linear-gradient(to right, #6366f1, #ec4899); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; font-size: 48px; font-weight: 700;
bg-gradient-to-r from-[#6366f1] to-[#ec4899] bg-clip-text text-transparent text-[48px] font-bold
Free online gradient text generator with live preview. Create eye-catching gradient text effects using pure CSS. Choose from beautiful preset gradients (Sunset, Ocean, Forest, Fire, and more) or pick custom colors with the color pickers. Adjust gradient direction, font size, and font weight to get the perfect look. Optionally add a third color stop for richer gradients. Copy the generated CSS code (using the background-clip technique) or Tailwind CSS utility classes with one click. Perfect for hero sections, headings, logos, and social media graphics. 100% browser-based, no signup required.
Intellure answers, sells, and follows up around the clock on WhatsApp, Instagram, and your website. Flat $299 a month, and there's no team to manage.
See Intellure
