Svelte Transitions: Declarative UI Animation
Svelte transitions are declarative animations for elements entering or leaving the DOM. Use `transition:fade` on a modal or `crossfade` for items moving between lists. The footgun: they only run on mount/unmount, not on general state changes.
Svelte transitions provide a simple, declarative way to animate elements as they enter or leave the DOM. Instead of manual timers, you just apply a directive like `transition:fly` for a notification or `crossfade` for moving items between lists. The common footgun is expecting transitions to run on any state change; they only trigger when an element is actually mounted or unmounted via a block like `{#if ...}`.
Read the original → svelte.dev
- #svelte
- #frontend
- #animation
- #ui
Get five bites like this every day.
Tezvyn delivers a daily feed of 60-second tech bites with quizzes to lock in what you learn.