---
title: "Phrase Transition"
url: "https://sanyam.sh/lab/phrase-transition"
date: "2025-09-27"
---

# Phrase Transition

Built a phrase transition component using Framer Motion's `AnimatePresence` with staggered opacity/y transforms.

key insight: `useEffect` with `setInterval` + `setTimeout` creates smooth state transitions without jank. the magic is in the exit/enter animations with `mode="wait"` - prevents layout shift while cycling through phrases.

- Source: https://x.com/sanyampunia/status/1971659845028733322