Library / Text effects

Split Reveal free

A headline cut across the middle: hover or focus and the halves part to reveal a hidden line in the gap.

Customize

The headline

The line revealed in the gap

Colour of the headline

Colour of the revealed line

How far each half moves (px)

Code

import SplitRevealHover from './SplitRevealHover';

<SplitRevealHover />

Checking your access…

Dependencies: none

text hover reveal headline

More in Text effects

Glyph DecodeA big mono word dissolves into random glyphs and resolves into the next one. Hover or tap to force the next decode.
Type PressureEach letter swells in weight and size as the cursor gets close, driven by a variable font axis.
Split Text RevealA headline whose words or letters rise out of an invisible mask one after another.