# MorphingText

Source: https://lumeo.nativ.sh/components/morphing-text

# MorphingText

Text morphs between two strings using an SVG blur+contrast filter trick — one word visually melts into the next.

## When to Use

-   Hero headings that alternate between two key value propositions.
-   Tagline animations where a smooth morph feels more polished than a simple swap.

Preview Code

Default Morph

 Hello

Copy Code

Preview Code

Fast Morph

 Design

Copy Code

## API Reference

### MorphingText

Property

Type

Default

Description

From

string

""

First string (shown initially).

To

string

""

Second string (morphed to).

DurationMs

int

1500

Duration of the morph transition in milliseconds.

PauseMs

int

2000

Time each text is held before morphing again.

## Related Components

-   [WordRotate](/components/word-rotate) — Slide-fade word rotation for hero headings.
-   [TypingAnimation](/components/typing-animation) — Character-by-character typing effect.