Shadcn.io is not affiliated with official shadcn/ui
React Tornado Background
Cinematic tornado funnel background for React and Next.js — hundreds of dust particles spiral around a tall vertical axis, tapering at top and bottom to form a stormy swirling column.
React Tornado Background preview
A tall, towering funnel of wind-blown dust that twists around a central vertical axis — wider through the middle, pinching at the top and bottom, with particles sweeping between the near and far sides of the column to sell real depth. Built on a single canvas with ~600 particles, a seeded PRNG, and one RAF loop, so it drops into any hero with zero dependencies. Perfect for weather apps, dramatic landing pages, storm-themed marketing, power / energy branding, and launch screens that need a sense of kinetic force.
Install with AI
If you've connected the shadcn.io MCP server to Claude Code, Cursor, Windsurf, or any MCP-ready AI editor, prompt your agent to install this background for you — no copy-paste, no CLI:
use shadcnio to install the tornado background into my projectRelated Components
Vortex
Simplex-noise particle vortex
Warp
Radial warp-speed streaks
Particles
Mouse-interactive floating particles
Fog
Drifting horizontal mist layers
Wavy
Stacked flowing wave lines
Light Waves
Ambient vertical color washes
FAQ
Was this page helpful?
Sign in to leave feedback.