v1.1.1 • Motion • 1kb gzipped • MIT
TiltCard
Pointer-reactive tilt and glare in a kilobyte, with a reduced-motion path that simply stops.
// why tiltcard
One kilobyte of polish
A single transform driven by pointer position, updated on the compositor, with nothing else running.
// stack
Quiet by default
Honours reduced motion by disabling entirely rather than substituting a lesser animation.
TiltCard started as a single file in a client project and stayed small on purpose. It does one job, it does it in 1kb gzipped, and it has no runtime dependencies.
Getting started
Install it, import it, call it:
npm i tiltcard-jsA single transform driven by pointer position, updated on the compositor, with nothing else running.
What it does not do
It does not manage your state, style your components or ship a plugin system. Those are your decisions, and keeping them out is what keeps the bundle honest.
- Compositor-only transforms
- Optional glare layer
- MIT licensed, commercially friendly
Features
Compositor-only transforms
No layout, no paint, no scroll listeners.
Optional glare layer
A single gradient element that tracks the pointer, or nothing at all.
Fully controllable
Play, pause, reverse and seek, all from a plain object.
Respects reduced motion
Reads the user preference and falls back to an instant state change.
ESM and types
Ships module and CommonJS builds with hand-written type definitions and source maps.
Sixty frames, measured
Performance is asserted in CI against a recorded trace, not assumed.
Get TiltCard v1.1.1
7 files • .min.js 1kb • .zip 93kb • sha384 verified
Changelog
- Glare layer made optional
- Reduced-motion disables completely
- Touch input no longer tilts
- Reworked the public API for consistency
- Deprecated helpers removed
- Fixed a memory leak on repeated teardown
- Source maps now published with every build
// related
Related products
ChartForge
Canvas charts in twelve lines. Responsive, accessible and dark-mode ready, with no D3 learning curve.
View →MotionEase
Physics-based micro-animations with a single call. Spring curves that feel right without a tuning session.
View →FormFlow
Validation and multi-step logic that works the same in React, Vue and vanilla. Your markup stays yours.
View →Make it move today.
MIT licensed. Commercial friendly. Five-minute setup.