Text Highlighter helps you create bold, animated text highlights for modern Framer websites without extra setup.
Use it to emphasize key words in hero headlines, landing pages, feature sections, portfolios, SaaS pages, and marketing copy. The component is built to be flexible, responsive, and easy to customize directly from the Framer control panel.
You can control the headline text structure, highlight content, colors, background padding, height, radius, rotation, vertical offset, alignment, max width, responsive typography, and scroll-triggered reveal animation.
What you can customize:
Text Before, Highlight Text 1, Highlight Text 2, and Text After
Inline or block highlight mode
Highlight background color, padding, height, radius, offset, and rotation
Separate font settings for L, M, and S breakpoints
Text alignment and max width per breakpoint
Scroll-based highlight reveal animation
Animation duration, delay, easing, replay behavior, and trigger amount
Text Highlighter is lightweight, flexible, and designed to help your headlines feel more polished, expressive, and attention-grabbing inside Framer.