Motion Core is a Svelte-native motion toolkit that brings GSAP and Three.js together as drop-in animated components for designers and developers building interactive web experiences.

Motion Core sits at a practical intersection: it takes the power of GSAP animation and Three.js 3D rendering and packages them as native Svelte components. For front-end designers who work in Svelte, that means adding high-quality motion design without writing low-level GSAP timelines or managing Three.js canvas lifecycle code manually. The library aims to make motion design a first-class citizen in Svelte development.

The toolkit covers three main territories. First, it handles standard motion design through animated Svelte components that respond to props and slots. Second, it provides 3D canvas solutions built on Three.js, so a designer can drop a three-dimensional scene into a Svelte template with minimal configuration. Third, it addresses interactive animations, giving developers ready-made patterns for scroll-driven, hover-driven, and gesture-driven motion that would otherwise require significant custom code.

Motion Core as a Design-Development Bridge

The motion core approach matters because animation is often where design and development diverge. A designer specifies motion in a prototype, and a developer rebuilds it from scratch in code. Motion Core reduces that gap by treating animated components as reusable design units. The same component that a developer drops into a Svelte app matches what the designer envisioned, because the motion is baked into the component itself.

The project is open source and has gathered steady interest on GitHub with over 267 stars at the time of writing. The documentation walks through each component category with examples, making it approachable for designers who are learning Svelte as well as for experienced developers looking to standardize their motion patterns. Motion Core represents a clear example of how a well-scoped toolkit can make motion design more consistent and more accessible across a team.

Motion Core is available at motion-core.dev. The source code and full documentation live on GitHub. Getting started is straightforward with the CLI: run npx @motion-core/cli init to scaffold your project, then add components one by one as you need them.