ngx-astro-word-morph

Word morph effect for Astro. A zero-runtime port of @omnedia/ngx-word-morph to Astro components — no Angular dependency.

Cycles through a list of words with a smooth morphing transition, perfect for animated headlines.

Features

• Pure Astro component (.astro), no Angular runtime.
• CSS/SVG filters, fully self-contained, no extra dependencies.
• Instances get unique ids, so you can use several on the same page.
• Animation pauses when off-screen (IntersectionObserver), same as the original.

Installation

npm install ngx-astro-word-morph

Usage

---
import WordMorph from 'ngx-astro-word-morph';
---

<WordMorph words={['design', 'build', 'deploy']} />

Props

| Prop | Default | | --------------- | ------------------------------ | | words | required (string[]) | | morphDuration | 1000 (ms) | | morphDelay | 5000 (ms) |

All components accept class for additional styling.

License

MIT. Original effect © Omnedia (MIT).