Gradient text. Rainbow, Instagram, hologram.
๐ Preview
How to use
- Type text.
- Pick 2 or 3 gradient colors.
- Adjust angle (90ยฐ=vertical, 0ยฐ=horizontal).
- Choose font and background.
- Optional animation.
Key features
- 2 or 3-color gradient
- 0โ360ยฐ angle
- 5 presets
- 4 fonts
- Animated color-flow option
Use cases
- Website headlines โ Hero section
- Logo text โ modern brand
- YouTube thumbnails โ trendy text
- Product ads โ eye-catcher
- Instagram stories
How background-clip: text works
CSS magic: set gradient as background, clip to text shape via background-clip:text, set color to transparent. Result: text itself becomes gradient. Supported since Chrome 1+; works in all modern browsers.
FAQ
Image-textured text?
Use a background image + same background-clip technique.
Other scripts?
Yes โ works with any font.
Email clients?
Outlook etc. don't support it. Use PNG instead.
Free?
Yes.