Skip to content

component

Chroma Text Reveal

By Aviral Lakhanpaul

Details

Summary

Powered by Framer Motion, Chroma Text Reveal delivers exceptional performance while giving you complete control over animation timing, easing, trigger conditions, repeat…

Description

Powered by Framer Motion , Chroma Text Reveal delivers exceptional performance while giving you complete control over animation timing, easing, trigger conditions, repeat behaviour, and an extensive multi-colour gradient system. Perfect for hero sections, landing pages, SaaS websites, AI startups, portfolios, product launches, and marketing websites . What Makes It Stand Out Animated gradient sweep text reveal Supports single or multiple text strings Automatic cycling through multiple headlines Smooth transitions Up to 10 customizable gradient colour stops Several animation easing styles Trigger animation on page load or when entering the viewport Optional repeat mode with configurable delay Automatically adapts to changing text widths Fully responsive across all screen sizes Screen reader friendly and accessibility focused Optimized animations with efficient cleanup Customisations Text Strings (Single or Multiple) Up to 10 Gradient Colors Base Text Color Text Font Duration Delay Animation Easing Functions Repeat Toggle Repeat Delay Animate On Load Animate On View Play Once Usage Add Chroma Text Reveal to your Framer canvas. Enter one or more text strings in the Texts property. Customize the gradient colors to match your brand. Adjust the typography to fit your design system. Configure the other properties to fit your desired look and feel. That's it!

Introduction

Animated gradient text reveal

Rank history

Daily rank per list, from the first snapshot — lower is better.

11012013013888/148/228/309/79/15
  • All · #388