Loading
Loading

Build the Interaction Layer Your Website is Missing.

Browse the EffectsBrowse the EffectsBrowse the EffectsUpgrade to ProUpgrade to ProUpgrade to Pro

40+ effects free, forever. No credit card.

© 2026 Hyperiux. All rights reserved. · Vault is built by Hyperiux · Small motion. Big signal.

Platform

Vault

  • Documentation
  • Pricing
  • NPM
  • MCP

Categories

  • All Effects
  • WebGL
  • Text
  • Backgrounds
  • Buttons
  • Carousels
  • Scroll
  • Components
  • Navigation
  • Cursor
  • Transitions
  • Loaders

Documents

  • Introduction
  • Installation
  • CLI
  • Dependencies
  • License

Legal

  • License Agreement
  • Terms of Service
  • Privacy Policy
  • Refund Policy
Socials
  • Twitter / X
  • LinkedIn
  • GitHub
  • Instagram
Contact Us
  • hello@hyperiux.com
New effects, in your inbox.

Every new drop, plus the occasional behind-the-scenes build. No spam. Unsubscribe anytime.

SubscribeSubscribe
HyperiuxHyperiux
All EffectsPricingGithubNPMMCP
Loading
HyperiuxHyperiux
All Effects
Featured ComponentsText AnimationsAnimated BackgroundsAnimated ButtonsCarousel EffectsScroll EffectsCreative ComponentsNavigationsCursor EffectsTransitionsLoadersWebGL & 3D Effects
IntroductionInstallationCLIDependenciesLicense
GithubNPMMCP Doc
Home/effects/featured

Featured Components

Browse a handpicked selection of effects and components from across Vault, curated to help you discover interesting interactions, useful ideas and strong starting points for your next build.

Trending

Text Animations
Pixel Text Fill

Pixel Text Fill

Backgrounds
Spider Particles Background

Spider Particles Background

Buttons
Arrow Fill Button

Arrow Fill Button

Carousels
Orbit Flip Slider

Orbit Flip Slider

Scroll Effects
Horizontal Feature Reveal

Horizontal Feature Reveal

Components
Infinite Grid Gallery

Infinite Grid Gallery

Navigation
Expanding Navbar

Expanding Navbar

Cursor Effects
Liquid Glass Cursor

Liquid Glass Cursor

Page Transitions
Aperture Transition

Aperture Transition

Loaders
Lines Loader

Lines Loader

Webgl Effects
Donut Particles

Donut Particles

TextBackgroundsButtonsCarouselsScrollComponentsNavigationCursorTransitionsLoadersWebGL

Layout

Donut Particles
Three.js@react Three/fiber
Pro

Donut Particles

Webgl Effects

1
Liquid Glass Cursor
GSAP

Liquid Glass Cursor

Cursor Effects

1
File Encryption
GSAP
Pro

File Encryption

Webgl Effects

1
Noise Ripple Cursor
Three.js
Pro

Noise Ripple Cursor

Cursor Effects

1
Horizontal Feature Reveal
GSAP

Horizontal Feature Reveal

Scroll Effects

14
Spider Particles Background
Three.js

Spider Particles Background

Backgrounds

21
Aperture Transition
GSAPNext Transition Router
Pro

Aperture Transition

Page Transitions

2
Lines Loader
GSAPLucide React
Pro

Lines Loader

Loaders

1
Hyperiux Glitter
Three.js@react Three/fiber+3
Pro

Hyperiux Glitter

Webgl Effects

2
Arrow Fill Button
Lucide React

Arrow Fill Button

Buttons

16
Expanding Navbar
GSAPLucide React
Pro

Expanding Navbar

Navigation

1
Dither Canvas
Canvas Shader
Pro

Dither Canvas

Backgrounds

3
Pixel Bloom Cursor
Canvas
Pro

Pixel Bloom Cursor

Cursor Effects

2
Grid Tunnel
Three.js@react Three/drei+1
Pro

Grid Tunnel

Webgl Effects

1
Hero Banner Animated
GSAPThree.js+6
Pro

Hero Banner Animated

Webgl Effects

Side Navbar
CSS
Pro

Side Navbar

Navigation

2
Phantom Image Trail
GSAP

Phantom Image Trail

Cursor Effects

31
Rotation Slider
GSAPLucide React

Rotation Slider

Scroll Effects

28
Load MoreLoad More

Questions, Answered.

What makes a component worth featuring?

A featured component should have a clear reason to stand out: strong craft, practical use, launch-page value, brand impact, technical quality, or a pattern the Hyperiux team believes users should notice first.

Is Featured only for the most visually dramatic effects?

No. Some featured components may be quiet but commercially useful. A Dotted Grid, Animated FAQ, Directional Menu, or premium CTA button can deserve attention as much as a WebGL hero or page transition.

How should users treat the Featured page?

Use it as a curated starting point, not a final answer. Featured helps users find strong candidates quickly, but the right component still depends on the page goal, audience, device mix, and performance budget.

When should a user leave Featured and browse a category instead?

If the user needs a specific behavior, such as a loader, cursor, form, carousel, or text reveal, they should open that category and compare more options. Featured is selective by design.

How should Featured previews stay fast?

The page should not run multiple heavy effects at once. WebGL, canvas, video, and continuous animation previews should use static thumbnails, lazy loading, offscreen pause, or click-to-preview behavior.

What accessibility standard should Featured components meet?

A component should not be featured only because it looks good. It should have a credible path for readable HTML, keyboard access where relevant, visible focus states, mobile behavior, and reduced-motion fallback.

View MoreView More

Request a Custom Animation

Need a custom effect? Tell us what to create.