Target Word Overlay

Layer a word over your headline in a completely different font, and it stays exactly where you put it at every screen size.

Target Word Overlay lets you pick any word in a headline and place accent text directly on top of it. A serif headline with a handwritten scribble over one word, a bold word stamped over its outlined twin, a splash of colour on the word that matters. The overlay is anchored to the word itself, not the frame, so when your headline wraps or reflows across breakpoints, the accent moves with it. No drifting, no manual repositioning, no stacked text layers to babysit.

It's also built with SEO in mind. Choose the heading tag (H1 to H6, or P) and the component renders the real HTML element, while the overlay is marked as decorative so it's skipped by screen readers.Features

• Fully responsive

• Independent font controls for the headline and the overlay

• Separate colour controls for both layers

• Semantic tag selector (H1 to H6, P) for SEO

• 14 blend modes for the overlay

• Offset, scale and rotation controls for a hand-placed feel

• Layer the overlay above or behind the word

• Option to hide the original word while keeping its space

• Text alignment and full typographic controls (size, weight, spacing, line height)

Works with any font in your project. Set font sizes per breakpoint using Framer's property overrides.