# VantaUI

Production-ready React and Next.js components, blocks, site templates, and app templates.

## MCP

Connect a coding agent to https://www.vantaui.com/api/mcp
Docs: https://www.vantaui.com/explore/docs/mcp

Anonymous clients can search the catalog and read free source. Plus and Pro tokens unlock paid source.

## Install

Copy the install command from the component or block page. Free items include that command for every visitor. Paid items include it with Plus or Pro. A catalog slug is not an install command.

## Catalog

- Components: https://www.vantaui.com/llms.txt
- Full metadata: https://www.vantaui.com/llms-full.txt
- JSON catalog: https://www.vantaui.com/api/ai/catalog.json

# Metadata

Source code is omitted from this file. Free items include source at their markdown URLs. Paid items require a Plus or Pro MCP token.

# Components

## Range Slider

- Kind: component
- Slug: range-slider
- Tier: pro
- Category: Input
- Styles: Minimal
- Page: https://www.vantaui.com/explore/components/range-slider
- Markdown: https://www.vantaui.com/llms/components/range-slider

An interactive modern numeric range slider.

## Lens Button

- Kind: component
- Slug: lens-button
- Tier: pro
- Category: Button
- Styles: Glass, Minimal
- Page: https://www.vantaui.com/explore/components/lens-button
- Markdown: https://www.vantaui.com/llms/components/lens-button

A text-only capsule glass button. Contrast, inset bevels, and a diagonal glare form the lens, and the whole control scales together so the glass stays in proportion.

## Void Background

- Kind: component
- Slug: void-background
- Tier: pro
- Category: Background
- Styles: Bold
- Page: https://www.vantaui.com/explore/components/void-background
- Markdown: https://www.vantaui.com/llms/components/void-background

A full-screen WebGL ink wave with a pointer ripple and a shifting noise overlay. The field is white in light mode and near-black in dark mode.

## Pill Stepper

- Kind: component
- Slug: pill-stepper
- Tier: pro
- Category: Input
- Styles: Minimal, Modern
- Page: https://www.vantaui.com/explore/components/pill-stepper
- Markdown: https://www.vantaui.com/llms/components/pill-stepper

A minus/plus pill whose fill grows from the left as the value rises.

## Orbit Account Menu

- Kind: component
- Slug: orbit-account-menu
- Tier: pro
- Category: Miscellaneous
- Styles: Dropdown, Menu, Avatar
- Page: https://www.vantaui.com/explore/components/orbit-account-menu
- Markdown: https://www.vantaui.com/llms/components/orbit-account-menu

Account dropdown with planet avatars, status badge and submenus.

## Publish Button

- Kind: component
- Slug: publish-button
- Tier: pro
- Category: Button
- Styles: Minimal
- Page: https://www.vantaui.com/explore/components/publish-button
- Markdown: https://www.vantaui.com/llms/components/publish-button

A blue gradient hold-to-publish button.

## Gooey Search

- Kind: component
- Slug: gooey-search
- Tier: pro
- Category: Input
- Styles: Gooey
- Page: https://www.vantaui.com/explore/components/gooey-search
- Markdown: https://www.vantaui.com/llms/components/gooey-search

Search bar that morphs open with a gooey effect and drips animated results.

## Metallic Button

- Kind: component
- Slug: metallic-button
- Tier: pro
- Category: Button
- Styles: Dark
- Page: https://www.vantaui.com/explore/components/metallic-button
- Markdown: https://www.vantaui.com/llms/components/metallic-button

A button with an animated metallic border, dotted sheen, and hover shimmer.

## Morph Svg Curve

- Kind: component
- Slug: morph-svg-curve
- Tier: pro
- Category: Background
- Styles: Light, Modern
- Page: https://www.vantaui.com/explore/components/morph-svg-curve
- Markdown: https://www.vantaui.com/llms/components/morph-svg-curve

Click-to-toggle SVG wipe that morphs from a flat edge into a curved gradient cover.

## Gravity Pills

- Kind: component
- Slug: gravity-pills
- Tier: pro
- Category: Miscellaneous
- Styles: Modern
- Page: https://www.vantaui.com/explore/components/gravity-pills
- Markdown: https://www.vantaui.com/llms/components/gravity-pills

Draggable pill labels that fall and collide in a Matter.js gravity scene.

## Star Rating

- Kind: component
- Slug: star-rating
- Tier: pro
- Category: Input
- Styles: Modern
- Page: https://www.vantaui.com/explore/components/star-rating
- Markdown: https://www.vantaui.com/llms/components/star-rating

Accessible star rating input with animated burst fills, hover previews, and live labels.

## Hold Button

- Kind: component
- Slug: hold-button
- Tier: pro
- Category: Button
- Styles: Minimal
- Page: https://www.vantaui.com/explore/components/hold-button
- Markdown: https://www.vantaui.com/llms/components/hold-button

An outline button that fills into a destructive action while held.

## Action Slider

- Kind: component
- Slug: action-slider
- Tier: pro
- Category: Gesture
- Styles: Minimal
- Page: https://www.vantaui.com/explore/components/action-slider
- Markdown: https://www.vantaui.com/llms/components/action-slider

An iOS-style slide control for destructive actions.

## Frequencii Sidebar

- Kind: component
- Slug: frequencii-sidebar
- Tier: pro
- Category: Sidebar
- Styles: Minimal, Light
- Page: https://www.vantaui.com/explore/components/frequencii-sidebar
- Markdown: https://www.vantaui.com/llms/components/frequencii-sidebar

A collapsible product sidebar for medium screens and up. It includes a New action, navigation, channel accounts with platform badges, and social connect rows. The collapsed state is restored after refresh.

## Frosted Glass Button

- Kind: component
- Slug: frosted-glass-button
- Tier: pro
- Category: Button
- Styles: Glass, Minimal
- Page: https://www.vantaui.com/explore/components/frosted-glass-button
- Markdown: https://www.vantaui.com/llms/components/frosted-glass-button

A frosted glass button with a colored plate underneath, noise frost on hover, and a slight cursor parallax.

## Terms Dialog

- Kind: component
- Slug: terms-dialog
- Tier: pro
- Category: Modal
- Styles: Modal, Light, Minimal
- Page: https://www.vantaui.com/explore/components/terms-dialog
- Markdown: https://www.vantaui.com/llms/components/terms-dialog

A terms acceptance dialog that turns a raw terms string into numbered sections, with a fading scroll area, an elastic checkbox that unlocks at the bottom, and a confirm button.

## Elastic Checkbox

- Kind: component
- Slug: elastic-checkbox
- Tier: pro
- Category: Toggle
- Styles: Minimal, Light
- Page: https://www.vantaui.com/explore/components/elastic-checkbox
- Markdown: https://www.vantaui.com/llms/components/elastic-checkbox

A checkbox that squishes on press and springs back with an elastic morph, drawing in a check mark when selected.

## Harbor Switch

- Kind: component
- Slug: harbor-switch
- Tier: pro
- Category: Toggle
- Styles: Minimal
- Page: https://www.vantaui.com/explore/components/harbor-switch
- Markdown: https://www.vantaui.com/llms/components/harbor-switch

An I/O power switch: off is a light capsule with a square thumb and an I-bar; on fills the track, springs the square across, and shows an O-ring.

## Integrations Dialog

- Kind: component
- Slug: integrations-dialog
- Tier: pro
- Category: Modal
- Styles: Modern, Dither
- Page: https://www.vantaui.com/explore/components/integrations-dialog
- Markdown: https://www.vantaui.com/llms/components/integrations-dialog

A connect-an-app dialog with a dithered header, paired app icons, permission list, copyable URL, and a blue connect CTA.

## Trial Popover

- Kind: component
- Slug: trial-popover
- Tier: pro
- Category: Miscellaneous
- Styles: Popover, Light, Minimal
- Page: https://www.vantaui.com/explore/components/trial-popover
- Markdown: https://www.vantaui.com/llms/components/trial-popover

Trial Popover is a remaining-trial chip with a shrinking circular meter. Clicking the chip (not the avatar) opens a spring-bloom popover with an upgrade header, Starter and Professional plan cards, and a dotted footer for credits and sales.

## Liquid Slider

- Kind: component
- Slug: liquid-slider
- Tier: pro
- Category: Input
- Styles: iOS, Glass, Input
- Page: https://www.vantaui.com/explore/components/liquid-slider
- Markdown: https://www.vantaui.com/llms/components/liquid-slider

An iOS-style range slider with a thin fill, quiet ticks, and a capsule thumb that turns to reactive liquid glass while dragging.

## Dynamic Tabs

- Kind: component
- Slug: dynamic-tabs
- Tier: pro
- Category: Tabs
- Styles: Tabs, Light, Minimal
- Page: https://www.vantaui.com/explore/components/dynamic-tabs
- Markdown: https://www.vantaui.com/llms/components/dynamic-tabs

A nested pill tab control that morphs a grouped pair of options out from a collapsed label, with a sliding indicator.

## Liquid Switch

- Kind: component
- Slug: liquid-switch
- Tier: pro
- Category: Toggle
- Styles: Toggle, Light, Minimal
- Page: https://www.vantaui.com/explore/components/liquid-switch
- Markdown: https://www.vantaui.com/llms/components/liquid-switch

An Apple-style liquid glass switch with a gooey blue track, press-to-bubble thumb, and tap or drag to toggle.

## Pill Toast

- Kind: component
- Slug: pill-toast
- Tier: pro
- Category: Toast
- Styles: Toast, Light, Minimal
- Page: https://www.vantaui.com/explore/components/pill-toast
- Markdown: https://www.vantaui.com/llms/components/pill-toast

A pill-shaped toast with a circular countdown dismiss control.

## Two Factor Dialog

- Kind: component
- Slug: two-factor-dialog
- Tier: pro
- Category: Modal
- Styles: Modal, Light, Minimal
- Page: https://www.vantaui.com/explore/components/two-factor-dialog
- Markdown: https://www.vantaui.com/llms/components/two-factor-dialog

A two-step 2FA dialog with a scan QR, copyable setup key, and formatted OTP verify field.

## Confirm Button

- Kind: component
- Slug: confirm-button
- Tier: pro
- Category: Button
- Styles: Modern
- Page: https://www.vantaui.com/explore/components/confirm-button
- Markdown: https://www.vantaui.com/llms/components/confirm-button

Primary confirm action with a blue gradient fill and an optional Enter shortcut badge.

## Upgrade Modal

- Kind: component
- Slug: upgrade-modal
- Tier: pro
- Category: Modal
- Styles: Modern, Minimal
- Page: https://www.vantaui.com/explore/components/upgrade-modal
- Markdown: https://www.vantaui.com/llms/components/upgrade-modal

A paywall modal with a featured plan card and trial CTA that shakes when dismiss is blocked.

## QR Code

- Kind: component
- Slug: qr-code
- Tier: pro
- Category: Miscellaneous
- Styles: Simple
- Page: https://www.vantaui.com/explore/components/qr-code
- Markdown: https://www.vantaui.com/llms/components/qr-code

A framed QR code with corner handles and an optional gradient scan overlay.

## Slide Delete Dialog

- Kind: component
- Slug: slide-delete-dialog
- Tier: pro
- Category: Modal
- Styles: Modern, Minimal
- Page: https://www.vantaui.com/explore/components/slide-delete-dialog
- Markdown: https://www.vantaui.com/llms/components/slide-delete-dialog

A destructive confirmation dialog with typed confirmation and an iOS-style slide-to-delete control.

## Delete Button

- Kind: component
- Slug: delete-button
- Tier: free
- Category: Button
- Styles: Modern
- Page: https://www.vantaui.com/explore/components/delete-button
- Markdown: https://www.vantaui.com/llms/components/delete-button
- Registry: https://www.vantaui.com/r/components/delete-button.json

A destructive red gradient button with an optional return-key shortcut badge.

## Delete Dialog

- Kind: component
- Slug: delete-dialog
- Tier: pro
- Category: Modal
- Styles: Modern, Minimal
- Page: https://www.vantaui.com/explore/components/delete-dialog
- Markdown: https://www.vantaui.com/llms/components/delete-dialog

A polished confirmation dialog with a copyable verification phrase and an accessible slide-to-delete control.

## Text Rotate

- Kind: component
- Slug: text-rotate
- Tier: pro
- Category: Text
- Styles: Simple
- Page: https://www.vantaui.com/explore/components/text-rotate
- Markdown: https://www.vantaui.com/llms/components/text-rotate

Animated text that rotates through a list with customizable transitions, splitting, staggering, looping, and manual controls.

## 3D Wave Scroll

- Kind: component
- Slug: 3d-wave-scroll
- Tier: pro
- Category: Miscellaneous
- Styles: Modern
- Page: https://www.vantaui.com/explore/components/3d-wave-scroll
- Markdown: https://www.vantaui.com/llms/components/3d-wave-scroll

A textured plane waves like a flag, then grows to fill the viewport as you scroll while the wave flattens.

## Text Clip Mask

- Kind: component
- Slug: text-clip-mask
- Tier: pro
- Category: Text
- Styles: Minimal
- Page: https://www.vantaui.com/explore/components/text-clip-mask
- Markdown: https://www.vantaui.com/llms/components/text-clip-mask

A sticky scroll scene that reveals a full-bleed image or video through expanding Inter letterforms.

## Text Repetition

- Kind: component
- Slug: text-repetition
- Tier: free
- Category: Text
- Styles: Modern, Bold
- Page: https://www.vantaui.com/explore/components/text-repetition
- Markdown: https://www.vantaui.com/llms/components/text-repetition
- Registry: https://www.vantaui.com/r/components/text-repetition.json

Scroll-driven headlines that stack copies of a word and peels them apart as the title crosses the viewport.

## Center Fill Button

- Kind: component
- Slug: center-fill-button
- Tier: pro
- Category: Button
- Styles: Simple
- Page: https://www.vantaui.com/explore/components/center-fill-button
- Markdown: https://www.vantaui.com/llms/components/center-fill-button

Expands a central circle to invert colors and shift the icon on hover.

## Cosmic Button

- Kind: component
- Slug: cosmic-button
- Tier: pro
- Category: Button
- Styles: Modern
- Page: https://www.vantaui.com/explore/components/cosmic-button
- Markdown: https://www.vantaui.com/llms/components/cosmic-button

Button with a 3D orbiting galaxy, drifting stars, and a rotating spark edge that lights up on hover.

## Shift Background

- Kind: component
- Slug: shift-background
- Tier: pro
- Category: Background
- Styles: Bold, Modern
- Page: https://www.vantaui.com/explore/components/shift-background
- Markdown: https://www.vantaui.com/llms/components/shift-background

Fullscreen canvas bloom of large drifting orbs. Hue shifts with simplex noise, then the whole field is blurred.

## RGB Shift Image

- Kind: component
- Slug: rgb-shift-image
- Tier: pro
- Category: Miscellaneous
- Styles: Modern, Bold
- Page: https://www.vantaui.com/explore/components/rgb-shift-image
- Markdown: https://www.vantaui.com/llms/components/rgb-shift-image

A Three.js image plane with hover RGB shift, pixel displacement, and smooth pointer-driven 3D tilt.

## Sparkle Button

- Kind: component
- Slug: sparkle-button
- Tier: pro
- Category: Button
- Styles: Modern
- Page: https://www.vantaui.com/explore/components/sparkle-button
- Markdown: https://www.vantaui.com/llms/components/sparkle-button

A button with sparkle particles, pulsing stars, a glowing hover, and a matching edge-trace animation.

## Dither Background

- Kind: component
- Slug: dither-background
- Tier: pro
- Category: Background
- Styles: Modern
- Page: https://www.vantaui.com/explore/components/dither-background
- Markdown: https://www.vantaui.com/llms/components/dither-background

Interactive WebGL background with Bayer dithering

## Data Tunnel

- Kind: component
- Slug: data-tunnel
- Tier: pro
- Category: Miscellaneous
- Styles: Simple
- Page: https://www.vantaui.com/explore/components/data-tunnel
- Markdown: https://www.vantaui.com/llms/components/data-tunnel

A blooming tunnel of lane lines and traveling signal trails.

## Cube Wave Background

- Kind: component
- Slug: cube-wave-background
- Tier: pro
- Category: Background
- Styles: Minimal, Light
- Page: https://www.vantaui.com/explore/components/cube-wave-background
- Markdown: https://www.vantaui.com/llms/components/cube-wave-background

Minimalistic and customizable 3D wave grid background with Three.js

## Glass Button

- Kind: component
- Slug: glass-button
- Tier: pro
- Category: Button
- Styles: Light, Modern
- Page: https://www.vantaui.com/explore/components/glass-button
- Markdown: https://www.vantaui.com/llms/components/glass-button

Frosted glass pill button with a soft gradient glow variant and a solid variant

## Sketch Button

- Kind: component
- Slug: sketch-button
- Tier: pro
- Category: Button
- Styles: Modern
- Page: https://www.vantaui.com/explore/components/sketch-button
- Markdown: https://www.vantaui.com/llms/components/sketch-button

Button that reacts to interaction with a burst of light tracing its borders.

## Glowing Cube Button

- Kind: component
- Slug: glowing-cube-button
- Tier: pro
- Category: Button
- Styles: Modern
- Page: https://www.vantaui.com/explore/components/glowing-cube-button
- Markdown: https://www.vantaui.com/llms/components/glowing-cube-button

A futuristic 3D button constructed from CSS-transformed planes to form a cube.

## Droplet Ball Background

- Kind: component
- Slug: droplet-ball-background
- Tier: pro
- Category: Background
- Styles: Modern
- Page: https://www.vantaui.com/explore/components/droplet-ball-background
- Markdown: https://www.vantaui.com/llms/components/droplet-ball-background

Bubble-like spheres that responds interactively to your mouse movements.

## Shiny Button

- Kind: component
- Slug: shiny-button
- Tier: pro
- Category: Button
- Styles: Shiny, Minimal
- Page: https://www.vantaui.com/explore/components/shiny-button
- Markdown: https://www.vantaui.com/llms/components/shiny-button

Tracks the user’s cursor position to drag a realistic light reflection across the button’s surface.

## Neon Tubes Background

- Kind: component
- Slug: neon-tubes-background
- Tier: pro
- Category: Background
- Styles: Modern, Bold
- Page: https://www.vantaui.com/explore/components/neon-tubes-background
- Markdown: https://www.vantaui.com/llms/components/neon-tubes-background

Background that generates a serpentine trail of glowing 3D geometry that fluidly follows the user’s input

## Iridescent Button

- Kind: component
- Slug: iridescent-button
- Tier: free
- Category: Button
- Styles: Light, Modern
- Page: https://www.vantaui.com/explore/components/iridescent-button
- Markdown: https://www.vantaui.com/llms/components/iridescent-button
- Registry: https://www.vantaui.com/r/components/iridescent-button.json

A button with a vibrant, shimmering border that physically follows the user’s cursor.

## Sine Wave Background

- Kind: component
- Slug: sine-wave-background
- Tier: free
- Category: Background
- Styles: Modern
- Page: https://www.vantaui.com/explore/components/sine-wave-background
- Markdown: https://www.vantaui.com/llms/components/sine-wave-background
- Registry: https://www.vantaui.com/r/components/sine-wave-background.json

A WebGL background effect rendering a glowing, undulating sine wave.

## Underline Link

- Kind: component
- Slug: underline-link
- Tier: free
- Category: Text
- Styles: Simple
- Page: https://www.vantaui.com/explore/components/underline-link
- Markdown: https://www.vantaui.com/llms/components/underline-link
- Registry: https://www.vantaui.com/r/components/underline-link.json

Link that generate unique underline path on hover.

## Morphing Switch

- Kind: component
- Slug: morphing-switch
- Tier: free
- Category: Toggle
- Styles: Modern
- Page: https://www.vantaui.com/explore/components/morphing-switch
- Markdown: https://www.vantaui.com/llms/components/morphing-switch
- Registry: https://www.vantaui.com/r/components/morphing-switch.json

Physically warp the vector path of switch during interaction.

## Tearing Paper Photo

- Kind: component
- Slug: tearing-paper-photo
- Tier: free
- Category: Miscellaneous
- Styles: Modern
- Page: https://www.vantaui.com/explore/components/tearing-paper-photo
- Markdown: https://www.vantaui.com/llms/components/tearing-paper-photo
- Registry: https://www.vantaui.com/r/components/tearing-paper-photo.json

Photo gallery with tearing animation on photo swipe

## Circle Magnet Button

- Kind: component
- Slug: circle-magnet-button
- Tier: pro
- Category: Button
- Styles: Simple
- Page: https://www.vantaui.com/explore/components/circle-magnet-button
- Markdown: https://www.vantaui.com/llms/components/circle-magnet-button

Circular button that is attracted to mouse pointer

## Spinning Text

- Kind: component
- Slug: spinning-text
- Tier: pro
- Category: Text
- Page: https://www.vantaui.com/explore/components/spinning-text
- Markdown: https://www.vantaui.com/llms/components/spinning-text

Text spinning on a 3D cylinder

## Theme Toggle

- Kind: component
- Slug: theme-toggle
- Tier: pro
- Category: Toggle
- Styles: Simple
- Page: https://www.vantaui.com/explore/components/theme-toggle
- Markdown: https://www.vantaui.com/llms/components/theme-toggle

Switch between dark and light mode

## Draggable Parallax

- Kind: component
- Slug: draggable-parallax
- Tier: pro
- Category: Miscellaneous
- Styles: Simple
- Page: https://www.vantaui.com/explore/components/draggable-parallax
- Markdown: https://www.vantaui.com/llms/components/draggable-parallax

Draggable slider with image parallax effects

## Cosmic App Download Button

- Kind: component
- Slug: cosmic-app-download-button
- Tier: pro
- Category: Button
- Styles: Simple
- Page: https://www.vantaui.com/explore/components/cosmic-app-download-button
- Markdown: https://www.vantaui.com/llms/components/cosmic-app-download-button

Download from app and play store button with cosmic animation

## Cursor Image Trail

- Kind: component
- Slug: cursor-image-trail
- Tier: free
- Category: Miscellaneous
- Styles: Modern
- Page: https://www.vantaui.com/explore/components/cursor-image-trail
- Markdown: https://www.vantaui.com/llms/components/cursor-image-trail
- Registry: https://www.vantaui.com/r/components/cursor-image-trail.json

Dynamic visual trail following the user’s cursor

## Folding Logo

- Kind: component
- Slug: folding-logo
- Tier: pro
- Category: Miscellaneous
- Styles: Modern
- Page: https://www.vantaui.com/explore/components/folding-logo
- Markdown: https://www.vantaui.com/llms/components/folding-logo

Folding logos for social proof

## Glow Button

- Kind: component
- Slug: glow-button
- Tier: pro
- Category: Button
- Styles: Modern
- Page: https://www.vantaui.com/explore/components/glow-button
- Markdown: https://www.vantaui.com/llms/components/glow-button

A button with a glowing backdrop effect

## Rubik's Cube

- Kind: component
- Slug: rubiks-cube
- Tier: pro
- Category: Miscellaneous
- Styles: Modern
- Page: https://www.vantaui.com/explore/components/rubiks-cube
- Markdown: https://www.vantaui.com/llms/components/rubiks-cube

Dark animated rubik's cube

## Vanish Text

- Kind: component
- Slug: vanish-text
- Tier: pro
- Category: Text
- Styles: Simple
- Page: https://www.vantaui.com/explore/components/vanish-text
- Markdown: https://www.vantaui.com/llms/components/vanish-text

Main headline with vanishing sub-text

## User Count

- Kind: component
- Slug: user-count
- Tier: pro
- Category: Text
- Styles: Simple
- Page: https://www.vantaui.com/explore/components/user-count
- Markdown: https://www.vantaui.com/llms/components/user-count

Animated live user count

## Slider Theme Toggle

- Kind: component
- Slug: slider-theme-toggle
- Tier: pro
- Category: Toggle
- Styles: Simple
- Page: https://www.vantaui.com/explore/components/slider-theme-toggle
- Markdown: https://www.vantaui.com/llms/components/slider-theme-toggle

Sliding toggle between dark and light mode

## App Download Button

- Kind: component
- Slug: app-download-button
- Tier: free
- Category: Button
- Styles: Simple
- Page: https://www.vantaui.com/explore/components/app-download-button
- Markdown: https://www.vantaui.com/llms/components/app-download-button
- Registry: https://www.vantaui.com/r/components/app-download-button.json

Simple download app on apple store and play store button

## Threads Button

- Kind: component
- Slug: threads-button
- Tier: pro
- Category: Button
- Styles: Modern
- Page: https://www.vantaui.com/explore/components/threads-button
- Markdown: https://www.vantaui.com/llms/components/threads-button

A sleek button with purple glow effects and hover animations.

## Slide Preloader

- Kind: component
- Slug: slide-preloader
- Tier: pro
- Category: Preloader
- Styles: Modern
- Page: https://www.vantaui.com/explore/components/slide-preloader
- Markdown: https://www.vantaui.com/llms/components/slide-preloader

A left sliding minimal preloader animation.

## Inverse Scale Button

- Kind: component
- Slug: inverse-scale-button
- Tier: free
- Category: Button
- Styles: Simple
- Page: https://www.vantaui.com/explore/components/inverse-scale-button
- Markdown: https://www.vantaui.com/llms/components/inverse-scale-button
- Registry: https://www.vantaui.com/r/components/inverse-scale-button.json

Scales a solid background from the center to invert text contrast on hover.

## Rating Badge

- Kind: component
- Slug: rating-badge
- Tier: pro
- Category: Miscellaneous
- Styles: Simple
- Page: https://www.vantaui.com/explore/components/rating-badge
- Markdown: https://www.vantaui.com/llms/components/rating-badge

A rating badge for social proof and trust

## Encrypt Button

- Kind: component
- Slug: encrypt-button
- Tier: pro
- Category: Button
- Styles: Simple
- Page: https://www.vantaui.com/explore/components/encrypt-button
- Markdown: https://www.vantaui.com/llms/components/encrypt-button

Button with scan and encrypt animation

## Stair Preloader

- Kind: component
- Slug: stair-preloader
- Tier: pro
- Category: Preloader
- Styles: Modern
- Page: https://www.vantaui.com/explore/components/stair-preloader
- Markdown: https://www.vantaui.com/llms/components/stair-preloader

A sliding stairs preloader animation.

## Neubrutalism Button

- Kind: component
- Slug: neubrutalism-button
- Tier: pro
- Category: Button
- Styles: Neubrutalism
- Page: https://www.vantaui.com/explore/components/neubrutalism-button
- Markdown: https://www.vantaui.com/llms/components/neubrutalism-button

Sharp animated button with shadow

## Text Opacity

- Kind: component
- Slug: text-opacity
- Tier: pro
- Category: Text
- Styles: Minimal
- Page: https://www.vantaui.com/explore/components/text-opacity
- Markdown: https://www.vantaui.com/llms/components/text-opacity

A text effect that animates the gradient opacity

## Tilt Badge

- Kind: component
- Slug: tilt-badge
- Tier: pro
- Category: Button
- Styles: Neobrutalism
- Page: https://www.vantaui.com/explore/components/tilt-badge
- Markdown: https://www.vantaui.com/llms/components/tilt-badge

A section headline button that tilts on hover.

## Pixel Preloader

- Kind: component
- Slug: pixel-preloader
- Tier: pro
- Category: Preloader
- Styles: Modern
- Page: https://www.vantaui.com/explore/components/pixel-preloader
- Markdown: https://www.vantaui.com/llms/components/pixel-preloader

A pixelated preloader animation.

## Ring Button

- Kind: component
- Slug: ring-button
- Tier: pro
- Category: Button
- Styles: Modern
- Page: https://www.vantaui.com/explore/components/ring-button
- Markdown: https://www.vantaui.com/llms/components/ring-button

A button with a ring and scale effect on hover.

## Countdown Pill

- Kind: component
- Slug: countdown-pill
- Tier: pro
- Category: Miscellaneous
- Styles: Minimal
- Page: https://www.vantaui.com/explore/components/countdown-pill
- Markdown: https://www.vantaui.com/llms/components/countdown-pill

A date countdown inside a pill

## Encrypt Text

- Kind: component
- Slug: encrypt-text
- Tier: pro
- Category: Text
- Styles: Minimal
- Page: https://www.vantaui.com/explore/components/encrypt-text
- Markdown: https://www.vantaui.com/llms/components/encrypt-text

Text that triggers a scrambled encryption animation on hover

## Flow Button

- Kind: component
- Slug: flow-button
- Tier: pro
- Category: Button
- Styles: Minimal, Modern
- Page: https://www.vantaui.com/explore/components/flow-button
- Markdown: https://www.vantaui.com/llms/components/flow-button

A primary button with stacked backdrop effect.

## Disperse Text

- Kind: component
- Slug: disperse-text
- Tier: pro
- Category: Text
- Styles: Minimal
- Page: https://www.vantaui.com/explore/components/disperse-text
- Markdown: https://www.vantaui.com/llms/components/disperse-text

A text featuring a dispersion effect on hover

## Gradient Button

- Kind: component
- Slug: gradient-button
- Tier: free
- Category: Button
- Styles: Minimal
- Page: https://www.vantaui.com/explore/components/gradient-button
- Markdown: https://www.vantaui.com/llms/components/gradient-button
- Registry: https://www.vantaui.com/r/components/gradient-button.json

Button with animated glowing gradient borders

# Blocks

## Gooey Hero

- Kind: block
- Slug: gooey-hero
- Tier: pro
- Category: Hero
- Styles: Minimal
- Page: https://www.vantaui.com/explore/blocks/gooey-hero
- Markdown: https://www.vantaui.com/llms/blocks/gooey-hero

A product hero with an icon badge, headline, and two calls to action. Below that, a folder row uses an SVG gooey filter so the active tab melts into a large preview.

## Harbor Pricing

- Kind: block
- Slug: harbor-pricing
- Tier: pro
- Category: Pricing
- Styles: Minimal
- Page: https://www.vantaui.com/explore/blocks/harbor-pricing
- Markdown: https://www.vantaui.com/llms/blocks/harbor-pricing

A four-plan event-gateway pricing section with a sliding selected card, Confirm Button CTAs, and a pay-as-you-go calculator for monthly events and optional extra throughput.

## Ember Pricing

- Kind: block
- Slug: ember-pricing
- Tier: pro
- Category: Pricing
- Styles: Modern, Minimal
- Page: https://www.vantaui.com/explore/blocks/ember-pricing
- Markdown: https://www.vantaui.com/llms/blocks/ember-pricing

A credit-volume pricing section with a dithered header, interpolating slider, yearly liquid switches, a currency picker, and core cards that collapse once you pass 1M credits.

## Velora Pricing

- Kind: block
- Slug: velora-pricing
- Tier: pro
- Category: Pricing
- Styles: Modern, Minimal
- Page: https://www.vantaui.com/explore/blocks/velora-pricing
- Markdown: https://www.vantaui.com/llms/blocks/velora-pricing

A clean three-tier pricing section with a soft billing toggle, featured gradient plan, dark premium card, and smooth animated price transitions.

## Lumen Pricing

- Kind: block
- Slug: lumen-pricing
- Tier: pro
- Category: Pricing
- Styles: Modern, Light
- Page: https://www.vantaui.com/explore/blocks/lumen-pricing
- Markdown: https://www.vantaui.com/llms/blocks/lumen-pricing

A two-plan pricing section with a rating badge, billing-cycle toggle, and animated multi-currency prices.

## Orbit Footer

- Kind: block
- Slug: orbit-footer
- Tier: pro
- Category: Footer
- Styles: Bold, Modern
- Page: https://www.vantaui.com/explore/blocks/orbit-footer
- Markdown: https://www.vantaui.com/llms/blocks/orbit-footer

Sticky full-viewport footer with an idle eyeball logo, CTA copy, and a letter-revealing full-width brand wordmark.

## Ollio Pricing

- Kind: block
- Slug: ollio-pricing
- Tier: pro
- Category: Pricing
- Styles: Modern
- Page: https://www.vantaui.com/explore/blocks/ollio-pricing
- Markdown: https://www.vantaui.com/llms/blocks/ollio-pricing

A two-plan pricing section with letter-swapping headlines, looping gradient orbs, and a desktop-only cursor-following crosshair.

## Eightball Header

- Kind: block
- Slug: eightball-header
- Tier: pro
- Category: Navigation
- Styles: Modern, Bold
- Page: https://www.vantaui.com/explore/blocks/eightball-header
- Markdown: https://www.vantaui.com/llms/blocks/eightball-header

Expandable floating header with scramble CTAs, a product/explore menu, social links, a featured members panel, and a showcase marquee.

## Screensaver 404

- Kind: block
- Slug: screensaver-404
- Tier: pro
- Category: 404
- Styles: Simple
- Page: https://www.vantaui.com/explore/blocks/screensaver-404
- Markdown: https://www.vantaui.com/llms/blocks/screensaver-404

A playful 404 page with bouncing image tiles, adaptive contrast text, and a customizable return button.

## Grainy Reviews

- Kind: block
- Slug: grainy-reviews
- Tier: pro
- Category: Testimonials
- Styles: Grainy, Minimal
- Page: https://www.vantaui.com/explore/blocks/grainy-reviews
- Markdown: https://www.vantaui.com/llms/blocks/grainy-reviews

A grainy social-proof section with a highlighted headline, rating badge, and expandable review cards.

## Rev Hero

- Kind: block
- Slug: rev-hero
- Tier: pro
- Category: Hero
- Page: https://www.vantaui.com/explore/blocks/rev-hero
- Markdown: https://www.vantaui.com/llms/blocks/rev-hero

A clean product hero with an eyebrow, headline, gradient CTA, and auto-rotating feature tabs over a shared background.

## Broken Glass 404

- Kind: block
- Slug: broken-glass-404
- Tier: pro
- Category: 404
- Styles: Modern, Dark
- Page: https://www.vantaui.com/explore/blocks/broken-glass-404
- Markdown: https://www.vantaui.com/llms/blocks/broken-glass-404

A 404 scene with floating refractive glass shards.

## Ollio Hero

- Kind: block
- Slug: ollio-hero
- Tier: pro
- Category: Hero
- Styles: Editorial
- Page: https://www.vantaui.com/explore/blocks/ollio-hero
- Markdown: https://www.vantaui.com/llms/blocks/ollio-hero

A scroll-shrinking studio hero over a continuously moving editorial image wall.

## Notch Hero

- Kind: block
- Slug: notch-hero
- Tier: pro
- Category: Hero
- Styles: Minimal
- Page: https://www.vantaui.com/explore/blocks/notch-hero
- Markdown: https://www.vantaui.com/llms/blocks/notch-hero

Hero with a fanning icon badge and a notched tab bar over a preview stage.

## Telescope Zoom

- Kind: block
- Slug: telescope-zoom
- Tier: pro
- Category: Gallery
- Styles: Minimal
- Page: https://www.vantaui.com/explore/blocks/telescope-zoom
- Markdown: https://www.vantaui.com/llms/blocks/telescope-zoom

Scroll-driven zoom with nested masked layers and floating images that rush toward the camera.

## Dual Wave Text

- Kind: block
- Slug: dual-wave-text
- Tier: pro
- Category: Gallery
- Styles: Modern, Bold
- Page: https://www.vantaui.com/explore/blocks/dual-wave-text
- Markdown: https://www.vantaui.com/llms/blocks/dual-wave-text

Opposing wave text across dual columns with scroll-driven sine wave math and synced images.

## Project Gallery

- Kind: block
- Slug: project-gallery
- Tier: pro
- Category: Gallery
- Styles: Bold
- Page: https://www.vantaui.com/explore/blocks/project-gallery
- Markdown: https://www.vantaui.com/llms/blocks/project-gallery

A card perspective effect, hover over the card to elevate card elements.

## Matrix Footer

- Kind: block
- Slug: matrix-footer
- Tier: pro
- Category: Footer
- Styles: Simple
- Page: https://www.vantaui.com/explore/blocks/matrix-footer
- Markdown: https://www.vantaui.com/llms/blocks/matrix-footer

Simple footer block with grid lines.

## Quartz Stories

- Kind: block
- Slug: quartz-stories
- Tier: pro
- Category: Testimonials
- Styles: Minimal
- Page: https://www.vantaui.com/explore/blocks/quartz-stories
- Markdown: https://www.vantaui.com/llms/blocks/quartz-stories

A sleek testimonial block for high-impact social proof.

## Expandable Faq

- Kind: block
- Slug: expandable-faq
- Tier: pro
- Category: FAQ
- Styles: Simple
- Page: https://www.vantaui.com/explore/blocks/expandable-faq
- Markdown: https://www.vantaui.com/llms/blocks/expandable-faq

Faq section that expands to show more items

## Quartz Header

- Kind: block
- Slug: quartz-header
- Tier: pro
- Category: Navigation
- Styles: Minimal
- Page: https://www.vantaui.com/explore/blocks/quartz-header
- Markdown: https://www.vantaui.com/llms/blocks/quartz-header

Minimal navigation bar

## Bento Reviews

- Kind: block
- Slug: bento-reviews
- Tier: pro
- Category: Testimonials
- Styles: Bold, Colourful
- Page: https://www.vantaui.com/explore/blocks/bento-reviews
- Markdown: https://www.vantaui.com/llms/blocks/bento-reviews

Modular bento-style grid with multi-colored testimonial cards.

## Axis Hero

- Kind: block
- Slug: axis-hero
- Tier: pro
- Category: Hero
- Styles: Bold, Modern
- Page: https://www.vantaui.com/explore/blocks/axis-hero
- Markdown: https://www.vantaui.com/llms/blocks/axis-hero

Bold hero section with animated stacked cards

## Plan Matrix

- Kind: block
- Slug: plan-matrix
- Tier: pro
- Category: Pricing
- Styles: Modern
- Page: https://www.vantaui.com/explore/blocks/plan-matrix
- Markdown: https://www.vantaui.com/llms/blocks/plan-matrix

A structured pricing matrix designed for quick plan comparison with retro grid backdrop

## Quartz Footer

- Kind: block
- Slug: quartz-footer
- Tier: pro
- Category: Footer
- Styles: Minimal
- Page: https://www.vantaui.com/explore/blocks/quartz-footer
- Markdown: https://www.vantaui.com/llms/blocks/quartz-footer

Minimal footer with glowing bar and theme switcher

## Quote Rail

- Kind: block
- Slug: quote-rail
- Tier: pro
- Category: Testimonials
- Styles: Modern
- Page: https://www.vantaui.com/explore/blocks/quote-rail
- Markdown: https://www.vantaui.com/llms/blocks/quote-rail

A sleek carousel for rotating customer quotes with brand context.

## Logo Cloud

- Kind: block
- Slug: logo-cloud
- Tier: free
- Category: Testimonials
- Styles: Modern
- Page: https://www.vantaui.com/explore/blocks/logo-cloud
- Markdown: https://www.vantaui.com/llms/blocks/logo-cloud
- Registry: https://www.vantaui.com/r/blocks/logo-cloud.json

A simple logo cloud for social proof

## Axis Clients

- Kind: block
- Slug: axis-clients
- Tier: pro
- Category: Testimonials
- Styles: Modern
- Page: https://www.vantaui.com/explore/blocks/axis-clients
- Markdown: https://www.vantaui.com/llms/blocks/axis-clients

Dual-column client list with opposing parallax scroll effects and staggered entrance animations.

## Perspective Gallery

- Kind: block
- Slug: perspective-gallery
- Tier: pro
- Category: Gallery
- Styles: Modern, Light
- Page: https://www.vantaui.com/explore/blocks/perspective-gallery
- Markdown: https://www.vantaui.com/llms/blocks/perspective-gallery

Showcase gallery with perspective cards on scroll.

## Gamma Hero

- Kind: block
- Slug: gamma-hero
- Tier: pro
- Category: Hero
- Styles: Modern, Bold
- Page: https://www.vantaui.com/explore/blocks/gamma-hero
- Markdown: https://www.vantaui.com/llms/blocks/gamma-hero

Hero block with endless draggable image grid.