Hyperiux Vault
Hyperiux Vault

Hyperiux Vault

Hyperiux Vault is a source-first library of React & Next.js interaction effects, animations, transitions and microinteractions ready to ship

Creator13 Listings
Hyperiux Vault
Hyperiux Vaultin Marketplace·17h

Hi everyone! We've just released Kyntra, a one-page landing template for a home-services app.

We built most of the page around the scroll. The hero sits on an animated gradient, the About phones drift apart, a large statement fills in with colour, the feature cards stack on top of each other, and a row of cards slides sideways while the section is pinned. A timeline draws itself down the "How it works" steps, the stats roll up digit by digit, and on desktop the footer is revealed from underneath.

"Get Started" opens an enquiry form, "Download Kyntra App" slides in a panel with a QR code, and the FAQ opens one question at a time. We set it up for Desktop, Tablet and Phone, with a full-screen menu on smaller screens. On touch devices, the blog card details stay visible instead of waiting for a hover.

The animated sections are code components, so you edit their content, colours and timings in the properties panel. Testimonials, stats and articles are fictional demo content, ready to swap.

We'd love to hear what you think, especially about how the scroll interactions feel on Tablet and Phone.

Hyperiux Vault
Hyperiux Vaultin Marketplace·1d

Hi everyone! We just released Elena Voss, a one-page portfolio template for web and brand designers.

Most of the page moves with the scroll. The hero portrait scales down as you scroll, project cards stack on top of each other, the services row slides in sideways while the section is pinned, and client logos fly in from depth. On desktop, a floating image follows you through the awards list, and the dividers bend under the pointer. There's also a swipeable testimonial carousel, an FAQ, and a contact form that opens in a modal from every "Get in Touch" button.

It's set up for Desktop, Tablet and Phone, and all logos, awards and testimonials are fictional demo content, ready to swap.

We'd love to hear what you think, especially about how the scroll interactions feel on Tablet and Phone.

Hyperiux Vault
Hyperiux Vaultin Marketplace·2w

Dimensional Switch: a slider where the image card flips in 3D and the headline swaps with it. Horizontal or vertical flip, arrows, dots and optional autoplay that pauses off-screen. Empty slides show placeholders until you add images.

Hyperiux Vault
Hyperiux Vaultin Marketplace·2w

Component #5: Stack Spread

Eight cards start clustered in a pile, then scatter across the screen as you scroll - each one on its own rotation and depth, with a little cursor drift once they've settled. A headline fades in partway through the scatter.

Built on framer-motion's scroll and spring hooks, not GSAP. Scroll length, stack scale, card radius, cluster rotation, background and text color are all exposed as controls. Respects reduced motion - rotation and the headline's scale-in flatten, cursor parallax turns off.

Hyperiux Vault
Hyperiux Vaultin Marketplace·2w

Hyperiux Strip Slide - a full-bleed image slider where the transition does the talking.

Click either half of the frame to move forward or back. The incoming image reveals through a staggered vertical strip wipe while it zooms in, with a thin progress bar tracking position at the top.

Each slide carries a chapter label and a title whose characters slide into place individually, plus a counter and a custom cursor that rotates to show which way a click will go.

Strip count, reveal speed, stagger timing, zoom amount, and accent color are all property controls, along with toggles for the progress bar, counter, and click controls. Autoplay is available, off by default.

Respects prefers-reduced-motion, and stays static on canvas/export.

Hyperiux Vault
Hyperiux Vaultin Marketplace·3w

Hyperiux Flip Card - a stack of cards that flips open into a gallery.

Click the stack and it spreads into a hero image with a rail of thumbnails, using GSAP's Flip plugin - same DOM nodes, no remount. Click any thumbnail to swap it into the hero spot, same transition. Each card can carry its own title, meta line, description, and caption, and the text fades out and reveals line-by-line (via SplitText) whenever the selection changes.

Arrow keys move between cards while it's open, Escape or clicking the background collapses it back to the stack. Falls back to a static layout under prefers-reduced-motion, and switches to a stacked mobile layout below 700px.

Free in the Hyperiux Vault.

Hyperiux Vault
Hyperiux Vaultin Marketplace·3w

Free component #2 in the Hyperiux Vault: Shiny Button.

The border is a conic gradient on a slow rotation, with a dot-pattern texture underneath so it reads as brushed metal instead of a screensaver. Hover it and the arc widens, brightens, and a glow breathes up from the bottom edge before settling back down.

Colour, sweep speed, border width, and corner radius are all property controls — no code, no override needed. It's pure CSS under the hood, so it costs you nothing to run.

Free in the Vault, install and go.

Hyperiux Vault
Hyperiux Vaultin Marketplace·3w

Arrow Fill Button is live - first of a run of Vault buttons headed to the Marketplace. Hover it, the fill sweeps in behind the label, the arrow swaps sides, and every color, the animation speed, and whether the fill even triggers are yours to set. Free.