Text Morph

Animates text by morphing shared letters between words, creating fluid transitions

Animates text by morphing shared letters between words, creating fluid transitions

Examples

npx shadcn@latest add "https://components.dylanwlim.com/c/text-morph.json"

Prop	Type	Default	Description
children	string		The text content to be animated.
as	keyof JSX.IntrinsicElements	'p'	The HTML tag to render, defaults to paragraph.
className	string	undefined	Optional CSS class for styling the component.
style	React.CSSProperties	undefined	Optional inline styles for the component.

Inspired by Family iOS app. See also Family Values

On This Page

Build with DWL Components

Use the copied registry, charts, blocks, and create tools in one place.

Start from the DWL Components create flow and customize from there.