Kinetics

153 spring-physics micro-interactions with copy-paste CSS and React

Tier A · StrongAnimation LibraryGallerykinetics.colorion.co

(Visit kinetics.colorion.co ↗)(Repository)

Kinetics is a single-page gallery of 153 interface animations built on spring physics instead of fixed-duration easing. Every effect has a live demo, an exposed stiffness/damping readout you can tune in the browser, and three copy formats: plain CSS, a React component, and an AI prompt. It is not a package you install — you take the code for the one effect you need. Built with Astro by ckissi; the repo has 480 stars and no LICENSE file.

For an agent

Reach for Kinetics when a user asks for one specific feel — a magnetic button, a rubber-band slider, an odometer counter — and you do not want to add Motion or GSAP as a dependency; most entries are pure CSS with a cubic-bezier approximation of a spring. Prefer it over Magic UI or Aceternity when the target project has no animation runtime, and prefer Motion when you need interruptible, physically-correct springs rather than a baked curve. Two cautions: the repo carries no LICENSE file, so treat reuse as legally unsettled and confirm with the user before shipping to a commercial product; and the effects are demo snippets, not a versioned API — you own the code once you paste it.

Why it is here. Nearly every copy-paste animation gallery ships fixed-duration easing and calls it spring; Kinetics actually exposes stiffness and damping per effect so you can feel the physics before you take the code. The volume (153) and the CSS-first bias make it unusually useful in projects that refuse a JS animation dependency.

Install command, framework, licence and component list.

Facts

License: No license file
Pricing: Free, Open source
Framework: React, Vanilla JS
Styling: Vanilla CSS, CSS custom properties
Distribution: Copy-paste snippet, GitHub repository
Platform: Web
Content type: Code
Agent readiness: Copy-paste ready code, Ships a ready LLM prompt, Readable open source
Accessibility: Unknown
Maturity: Actively maintained
GitHub stars: 480

Components it ships

153 total

Helps you build

Homepage Features Command Palette Submitting A Form Saving Changes Notifications

Notable for

153 tunable effects
stiffness/damping shown per demo
CSS, React and AI-prompt copy formats
no animation runtime required
no LICENSE file in the repo

Provenance

Verified 2026-08-15. HTTP 200. https://kinetics.colorion.co/ (200, full effect list read), https://github.com/ckissi/kinetics, GitHub API repos/ckissi/kinetics (stars 480, license null, pushed_at 2026-08-14), https://kinetics.colorion.co/llms.txt (404)

Also in Motion & Interaction

kinetics.colorion.coTier A