sh4dcnv2 · atlas
← libraries

@threecn

3D scenes for shadcn/ui. Theme-aware React Three Fiber components, one command away.

28 components react shadcn-cli MIT

Install this registry

shadcn (npm) npx shadcn@latest add https://threecn.dev/r/registry.json
pnpm pnpm dlx shadcn@latest add https://threecn.dev/r/registry.json
bun bunx shadcn@latest add https://threecn.dev/r/registry.json
fetch registry curl -s https://threecn.dev/r/registry.json

Components

28 total
SceneContainer ui

Base R3F canvas wrapper with theme-aware environment and camera setup.

npx shadcn@latest add https://threecn.dev/r/scene-container.json
ParticleField ui

A drifting cloud of particles colored with your shadcn --primary and --muted-foreground tokens.

npx shadcn@latest add https://threecn.dev/r/particle-field.json
ProductViewer ui

An orbitable, polished product volume with an emissive --primary tint; hover slows the spin.

npx shadcn@latest add https://threecn.dev/r/product-viewer.json
FloatingCard3D ui

A parallax-tilting 3D card with a --background surface, --border edges, and an HTML overlay.

npx shadcn@latest add https://threecn.dev/r/floating-card-3d.json
Text3D ui

Extruded, floating 3D text rendered with drei <Text3D>, colored with --primary.

npx shadcn@latest add https://threecn.dev/r/text-3d.json
ProductShowcase ui

A product on a circular pedestal with soft contact shadows, studio lighting and slow auto-rotate.

npx shadcn@latest add https://threecn.dev/r/product-showcase.json
Globe ui

A dotted globe rotating slowly with orbit rings, colored with your --primary token.

npx shadcn@latest add https://threecn.dev/r/globe.json
WaveTerrain ui

An undulating wireframe terrain in perspective, drawn with --primary.

npx shadcn@latest add https://threecn.dev/r/wave-terrain.json
Crystal ui

A faceted glass gem with real refraction and a glowing core, tinted with --primary.

npx shadcn@latest add https://threecn.dev/r/crystal.json
Halo ui

A glowing energy core wrapped by tilted orbit rings carrying satellites.

npx shadcn@latest add https://threecn.dev/r/halo.json
DnaHelix ui

A rotating double helix of spheres joined by rungs, colored with --primary and --accent.

npx shadcn@latest add https://threecn.dev/r/dna-helix.json
Vortex ui

A spiral galaxy of points fading from --primary at the core to --muted-foreground at the rim.

npx shadcn@latest add https://threecn.dev/r/vortex.json
AuroraRibbons ui

Silky aurora ribbons drifting in slow sine waves, shaded with a --primary → --accent gradient.

npx shadcn@latest add https://threecn.dev/r/aurora-ribbons.json
NetworkGraph ui

A living plexus of drifting nodes that link up when close, fading from --primary to --muted-foreground.

npx shadcn@latest add https://threecn.dev/r/network-graph.json
Metaballs ui

Liquid metaballs that merge and split as they orbit each other, tinted with --primary.

npx shadcn@latest add https://threecn.dev/r/metaballs.json
CubeWave ui

A grid of instanced cubes riding a radial wave, blending --accent troughs into --primary crests.

npx shadcn@latest add https://threecn.dev/r/cube-wave.json
IsoCity ui

A procedural isometric skyline rotating under fog, with a few towers pulsing in --primary.

npx shadcn@latest add https://threecn.dev/r/iso-city.json
WarpTunnel ui

Hyperspace star streaks racing past the camera, from --foreground heads to --primary tails.

npx shadcn@latest add https://threecn.dev/r/warp-tunnel.json
Phyllotaxis ui

A sunflower-style bloom of instanced petals placed by the golden angle, breathing from --primary at the core to --accent at the rim.

npx shadcn@latest add https://threecn.dev/r/phyllotaxis.json
StrangeAttractor ui

The Aizawa attractor integrated live into one glowing orbit that never repeats, colored --primary to --accent with a sweeping head.

npx shadcn@latest add https://threecn.dev/r/strange-attractor.json
CurlFlow ui

Particles advected through a divergence-free curl-noise field into silky filaments, tinted --accent to --primary by height.

npx shadcn@latest add https://threecn.dev/r/curl-flow.json
Cloth ui

A real spring-mass cloth (Verlet) hanging from its top edge and rippling under procedural wind, with the theme woven --primary to --accent.

npx shadcn@latest add https://threecn.dev/r/cloth.json
Boids ui

A living flock steering by separation, alignment and cohesion; each agent tints --accent when slow to --primary at full speed.

npx shadcn@latest add https://threecn.dev/r/boids.json
VoronoiShatter ui

A sphere fractured into Voronoi shards that drift apart and snap back together, each facet shading --accent to --primary by height.

npx shadcn@latest add https://threecn.dev/r/voronoi-shatter.json
Tesseract ui

A 4D hypercube in double rotation projected into 3D — the inner cell endlessly swells through the outer, struts shading --accent to --primary by 4D depth.

npx shadcn@latest add https://threecn.dev/r/tesseract.json
PendulumWave ui

A row of pendulums with stepped periods drifting into snakes, arches and chaos before snapping back in phase, bobs tinted --accent to --primary across the swin…

npx shadcn@latest add https://threecn.dev/r/pendulum-wave.json
PitchMomentum ui

A soccer pitch of dots where two rival particle mountains surge and clash as momentum swings, crests whitening where the fronts collide.

npx shadcn@latest add https://threecn.dev/r/pitch-momentum.json
WorldCup ui

The World Cup trophy modeled procedurally: two sculpted figures with raised arms lift a continent-embossed globe above a green-banded base, turning under studi…

npx shadcn@latest add https://threecn.dev/r/world-cup.json