Motion without the bloat
How scroll reveals and page transitions stay lightweight with Motion and Astro islands.
Animation should feel intentional, not expensive.
What this site uses
- Astro
ClientRouterfor smooth page transitions (View Transitions API) - Motion (
motionon npm) for scroll-triggered reveals inside a Preact island - CSS for hover states and design-token-driven motion timing
The reveal island mounts once per page and only animates elements marked with data-reveal. If the visitor prefers reduced motion, reveals are skipped entirely.