Effects
Effects Monthly
WebGLThree.JS
Free
MotionGSAP
React.JSNext.JS
Vault is easiest to understand when you feel it. Preview a few high-impact effects below, then open the full catalogue when you are ready.
Preview
Browse by the moment you need: a sharper scroll, a cursor with presence, a cleaner transition. See exactly what it does before it touches your project.
Install
Use the Honyaku CLI to add only the effect you need. Vault adds only the files that effect needs, not a full interaction ocean. You can inspect and own the implementation.
Tune
Edit copy, layout, timing, easing, breakpoints, hover states, mobile fallbacks and reduced-motion behavior to match your brand and product.
Ship
Deploy a website that feels abstract, more noticeable, and more memorable, without rebuilding every interaction from scratch.
amazing_project
app/page.jsx
amazing_project / Components
ui
Anyone can add a fade. What's hard is everything around it. Get timing, restraint, or performance wrong, and the moment meant to impress becomes the reason the site feels worse. Most teams see that risk and drop their ambitions to play it safe. And your interface ends up looking like everyone else's. Vault is engineered around that discipline by default, not as an afterthought.
The Risks
What Vault Fixes
Dropped Frames
Precise timing and sequencing tuned against actual hardware.
Timing
Motion Noise
Motion that supports content, not distracts from it.
Restraint
Device Motion Off
Respects user preferences and accessibility out of the box.
Reduced-motion
Jank & Layout Shift
No unexplained CLS, no jank, no dropped frames as standard.
Performance budget
Hidden Bundle Size
Dependency honest. Every effect pulls in only what's needed.
Dependency clarity
Touch Devices
Responsive behaviour built for touch and smaller screens.
Mobile fallbacks
Memory leaks
No leaks, no ghosts, no lingering listeners.
Cleanup on unmount
Stop rebuilding the same scroll reveal, text animation, cursor trail, and transition from scratch. Start from production-ready source and shape it to your project.
Make your launch page feel more premium without hiring a full motion team. Use Vault to speed up build cycles, and raise perceived product quality.
Move faster on client websites while keeping the work custom. Use Vault as a starting point for high-end interaction systems, then adapt the code for each brand.
Get the creative benefit of premium motion without committing to an opaque dependency. Source-first code, clear stack choices, and a workflow your developers can own.
Upgrade the moments that affect perception: hero sections, campaign pages, product storytelling, proof sections, and final CTAs.
The Free Core lets you judge Vault where it matters: inside your own stack. Pro gives frequent users the full library, advanced effects, and ongoing releases.
Free
$0
Forever
For trying real effects in real projects.
Pro
$179 yearly
Yearly
3 months free
For developers, founders, and agencies shipping premium work.
Instant access · npx hyperiux login · Cancel anytime
Cancel anytime. The free core stays free forever. Every effect lives in your repo. So even if you leave, your code stays.
Vault is a source-first interaction effects library for React and Next.js. It covers scroll effects, text animations, cursor systems, page transitions, WebGL scenes, backgrounds, navigation patterns, creative components, and microinteractions. Effects install as editable code inside your project.
Keep the UI library. Your design system handles interface primitives such as buttons, forms, cards, grids, and tabs. Vault handles how parts of the interface enter, respond, transition, and move through time.
Those tools give you animation and rendering primitives. Vault gives you composed interaction patterns with a working structure, production decisions, and implementation guidance already in place. You still have the source, so the underlying tools remain fully available.
The effect source is installed inside your project and can be inspected and modified locally. Usage rights follow the Free Core or Pro license attached to the effect.
Any interaction can hurt performance when used badly. A text reveal and a continuous WebGL scene have very different costs. Vault exposes dependencies and implementation notes so your team can make that decision with the page, device, and performance budget in mind. Test production pages on real devices before shipping.
Effects with significant motion should include a reduced-motion strategy or implementation guidance. The final behaviour remains under your control because the source lives in your project.
Vault is a public slice of how Hyperiux approaches interaction design. Need something custom? We'll design and build it from scratch.
