Marker Text Outline

Marker Text Outline is a Framer component that highlights specific words with animated, hand-drawn marker-style outlines.

Marker Text Outline is a Framer component that highlights specific words with animated, hand-drawn marker-style outlines. It brings a natural, expressive feel to text by simulating marker strokes that draw in smoothly around selected words. You can choose from multiple highlight styles including underline, wiggle underline, strikethrough, and circle. The component is fully responsive and easy to customize, with controls for marker color, opacity, stroke width, and typography. Key Features Animated marker-style text outlines Highlight specific words or phrases Multiple styles including underline, wiggle, strike, and circle Customizable marker color, opacity, and stroke width Smooth draw-in animation Responsive by default Use Cases Hero headlines and callouts Marketing and landing pages Educational and content-focused layouts Creative portfolios Emphasis on key messaging Best Practices / Tips Highlight only important words for clarity Use softer colors for a natural marker look Match stroke width to font size for balance What’s Included One Marker Text Outline component Multiple marker highlight styles Typography and animation controls Who It’s For Framer designers and builders Founders and marketers Creative agencies and studios No-code creators adding expressive text emphasis