Zero dependencies, full control

Hello

A zero-dependency, highly customizable text morphing component. Create buttery-smooth transitions between text states with physical spring animations and organic blur effects.

Get Started

Designed for perfection

Every detail crafted to deliver the smoothest text morphing experience possible.

Fluid Blur Transitions

Per-character CSS blur transitions via the Web Animations API for organic, liquid-like crossfades that never look harsh.

Zero Dependencies

Lightweight with zero runtime dependencies. No external physics libraries or animation frameworks required.

Spring Physics

Built-in spring solvers ensure natural settling and continuous velocity for realistic, physical motion.

Character Staggering

Control the delay between individual character animations for wave and cascade effects across your text.

Interactive Playground

Tweak the parameters below to see how FluxMorph handles different easing curves, blur intensities, and spring physics in real-time.

Text Presets

Before Text

After Text

DurationHow long the morph animation takes from start to finish.600ms

Blur IntensityApplies a per-character blur filter during transitions. 0 = opacity-only, higher = more dramatic.8px

StaggerDelay between each character's animation start. Creates a wave/cascade effect across the text.25ms

Easing PresetControls the acceleration curve of the animation. Ignored when Spring Physics is enabled.

Easing EnterOverride the easing curve for entering characters. Leave empty to use preset or auto-invert.

Easing ExitOverride the easing curve for exiting characters. Leave empty to use preset or auto-invert.

Spring PhysicsUses spring physics (tension, friction, mass) instead of bezier easing for more natural motion.

Processing Transaction

Generated Code

import { FluxMorph } from 'fluxmorph';

const el = document.getElementById('my-text');
const instance = FluxMorph.create(el, {
  preset: 'apple-dynamic-island',
  blur: 8
});

await instance.to('Complete');

Get Started

npm install fluxmorph