Pricing
Get Started
  • Introduction
  • Installation
  • MCP Server
  • Saved
Site
  • Builder (Beta)
  • Pricing
  • Roadmap
  • Affiliates
Browse
  • All Components80 New
Text34
  • 3D Letter Swap
  • 3D Text Reveal
  • ASCII Ripple
  • Bending Marquee
  • Blur Highlight
  • Cipher RevealNew
  • Domino LetteringNew
  • Elastic LetteringNew
  • Ghost TypeNew
  • Glitch Text
  • Glyph LotteryNew
  • Gravity LettersNew
  • Label OrbitNew
  • Luminous TypeNew
  • Mesh LetteringNew
  • Orbital TypeNew
  • Particle Text
  • Ribbon TypeNew
  • Rising InkNew
  • Shatter TypeNew
  • Signal TypeNew
  • Smoke TypeNew
  • Speeding Text
  • Spring LetteringNew
  • Staggered Text
  • Stipple TypeNew
  • Tessera TrailNew
  • Text Cube
  • Text MorphNew
  • Text Path
  • Text Scatter
  • Typographic WallNew
  • Vapor TypeNew
  • Wave LetteringNew
Backgrounds98
  • ASCII Tiles
  • Ascii Waves
  • Astral ShellNew
  • Aura Blob
  • Aurora Beam
  • Aurora Blur
  • Axial BeamNew
  • Binary OrbitsNew
  • Black Hole
  • Blinking Dots
  • Blinking Squares
  • Blurred Rays
  • Chroma Blinds
  • Chroma CurrentNew
  • Chroma Waves
  • Cloud AtlasNew
  • Color Loops
  • Concentric TidesNew
  • Contour TideNew
  • Dappled LightNew
  • Dither Wave
  • Dot Shift
  • Eclipse
  • Fading StarsNew
  • Falling Rays
  • Flame Paths
  • Fog Sphere
  • Glass Flow
  • Glass Tiles
  • Glimmer WrapNew
  • Glitter Warp
  • Glowing Ridges
  • Glowing Wave
  • Glue Dots
  • Glyph EmberNew
  • Glyph OrbNew
  • Glyph SonarNew
  • Glyph TideNew
  • Gradient Bars
  • Grain Wave
  • Halftone Vortex
  • Halftone Wave
  • Hexagonal VaultNew
  • Horizon BloomNew
  • Interference RibbonsNew
  • Landscape
  • Light Droplets
  • Lightspeed
  • Liquid Bars
  • Liquid Lines
  • Long Exposure
  • Luminous FilamentsNew
  • Metallic Swirl
  • Minimal Ripple
  • Mosaic
  • Mosaic Waves
  • Neon Reveal
  • Neural Flash
  • Neural Float
  • Neural Tunnel
  • Nexus RaysNew
  • Perspective Grid
  • Photon KnotNew
  • Pixel Rain
  • Prismatic SlatsNew
  • Radial Liquid
  • Ravine
  • Retro Lines
  • Ring FieldNew
  • Rising Lines
  • Rising Particles
  • Rolling Blinds
  • Rotating Stars
  • Rubber Fluid
  • Satin RidgesNew
  • Shader Waves
  • Shadow Bars
  • Silk Waves
  • Simple Swirl
  • Specter Orb
  • Spectral Clouds
  • Spectral DrapeNew
  • Spiral FunnelNew
  • Square Matrix
  • Squares Terminal
  • Squircle Shift
  • Star Swipe
  • Swirl Blend
  • Synaptic Shift
  • Tech Wall
  • Terminal RainNew
  • Thinking Dots
  • Twilight Lines
  • Vortex
  • Voxel ArcNew
  • Warp Twister
  • Watercolor
  • Wireframe Ball
3D & Shaders49
  • Agentic Ball
  • AI Blob
  • Album RailNew
  • Bend Gallery
  • Chrome OrbitNew
  • Circle Stack
  • Concave CarouselNew
  • Constellation GalleryNew
  • Contact SheetNew
  • Depth Card
  • Depth Image
  • Depth RibbonNew
  • Device
  • Dolly Gallery
  • Elastic ReelNew
  • Elastic StickerNew
  • Ember RevealNew
  • Expanding GridNew
  • Frame Border
  • Glass Reveal
  • Globe
  • Gradient Blob
  • Helix GalleryNew
  • Infinite Gallery
  • Inverted Dome
  • Iris GalleryNew
  • Lenticular Carousel
  • Momentum RingNew
  • Page Flip
  • Parallax Carousel
  • Particle Image
  • Particle Morph
  • Passage GalleryNew
  • Pixel Reveal
  • Pixel Sculpt
  • Pixelate Hover
  • Pond ImageNew
  • Portal
  • Prism CarouselNew
  • Rotating Cards
  • Scroll BendNew
  • Scroll Portal
  • Shader Card
  • Shader Reveal
  • Spin ShutterNew
  • Star Burst
  • Tumble Carousel
  • Twisting Gallery
  • Warped Card
Cursor Effects21
  • Arc CursorNew
  • Ascii Cursor
  • Celebration CursorNew
  • Chroma HaloNew
  • Cursor Wave
  • Custom Cursor
  • Dither Cursor
  • Drafting CursorNew
  • Glass Cursor
  • Glyph StreamNew
  • Grid Rise
  • Gyroscope CursorNew
  • Liquid Ascii
  • Parallax Pills
  • Pigment TrailNew
  • Pixel Magnet
  • Ribbon TrailNew
  • Smooth Cursor
  • Snapshot TrailNew
  • Stardust CursorNew
  • User Cursor
UI & Cards28
  • Animated List
  • Card Spread
  • Center Flow
  • Chroma Card
  • Circle Gallery
  • Circles
  • Click Stack
  • Comparison Slider
  • Credit Card
  • Draggable Grid
  • Frame Scrub
  • Gradient Carousel
  • Hover Preview
  • Liquid Swap
  • Loupe ImageNew
  • Magic Transform
  • Modal Cards
  • Orbit ReelNew
  • Parallax Cards
  • Preloader
  • Reel Gallery
  • Scroll Mask
  • Scroll Stack
  • Simple Graph
  • Skewed Carousel
  • Tile Reveal
  • Tilted Tiles
  • Tumble WallNew
  1. Docs
  2. Components
  3. Backgrounds
  4. Wireframe Ball

Animated components, blocks, and templates for React. Pay once, ship stunning pages forever.

pro@reactbits.dev

Site

HomeBuilder (Beta)PricingTestimonialsFAQsRoadmapChangelogFree Components

Docs

IntroductionInstallationMCP ServerComponentsBlocksTemplates

Resources

AboutUse casesComparisonsAlternativesFor AI agents

Legal & Account

LoginAffiliateLicensePrivacyContact

© 2026 pro.reactbits.dev. All rights reserved.

Wireframe Ball

A rotating wireframe shape you can drag to spin

wireframe-ball-tw
pro.reactbits.dev
ComponentsBlocksTemplatesPricing
Get Pro

Give your ideas shape

Premium animated components and blocks, crafted to make your next launch feel alive.

Get startedBrowse library
9:41

Give your ideas shape

Premium animated components and blocks, crafted to make your next launch feel alive.

Get startedBrowse library

Give your ideas shape

Premium animated components and blocks, crafted to make your next launch feel alive.

Get startedLearn more

Customize

Detail
0
Stretch
1.28
Zoom
1.00
Speed
1.00
Wobble
0.000
Edge Color
Edge Glow
1.00
Edge Thickness
0.020
Vertex Color
Vertex Size
0.032
Vertex Glow
0.148
Depth Color
Depth Tint
0.00
Depth Fade
0.00
Brightness
1.00
Opacity
1.00
Cursor Tilt
0.35
Spin Friction
0.940
Target FPS
60
DPR
2.0

Props

31
NameTypeDefaultDescription
shape"tetrahedron" | "cube" | "octahedron" | "dodecahedron" | "icosahedron""icosahedron"Base polyhedron the wireframe is built from
detailnumber0Geodesic subdivision level (0-3). Each step splits every face into four, multiplying vertices and edges
stretchnumber1.28Elongation of the icosahedral vertex rings. 1.618 gives a perfectly regular icosahedron
zoomnumber1Scale of the solid within the frame
speednumber1Rate of the tumbling motion
wobblenumber0Amount the solid breathes in and out as it turns
showEdgesbooleantrueRender the glowing struts between vertices
edgeColorstring"currentColor"Colour of the struts. Defaults to the inherited text colour, so it tracks the page theme automatically
edgeGlownumber1Brightness of the strut glow
edgeThicknessnumber0.02Core radius of a strut. Larger values give a wider, softer line
showVerticesbooleantrueRender the bright dot at each vertex
vertexColorstring"currentColor"Colour of the vertex dots. Defaults to the inherited text colour, so it tracks the page theme automatically
vertexSizenumber0.032Radius of each vertex dot
vertexGlownumber0.148Brightness of each vertex dot, scaled by how many struts meet there
depthColorstring"#7aa2ff"Colour blended into the far side of the solid
depthTintnumber0How strongly depthColor is mixed into the receding side
depthFadenumber0How much the far side dims, adding a sense of volume
backgroundColorstring"transparent"Backdrop behind the wireframe. Transparent by default so it layers over whatever sits underneath; the glow is additive, so dark backdrops read best
brightnessnumber1Overall output gain
opacitynumber1Opacity of the whole wireframe
cursorInteractionbooleantrueLet the pointer tilt the solid as it hovers
cursorTiltnumber0.35Maximum tilt in radians applied by the pointer
dragToSpinbooleantrueGrab the solid and throw it, with momentum on release
spinFrictionnumber0.94How quickly a thrown spin slows down. Lower stops sooner
adaptiveQualitybooleantrueDrop render resolution automatically if the frame rate falls short
targetFpsnumber60Frame rate adaptive quality aims to hold
dprnumber2Upper bound on device pixel ratio
pausedbooleanfalseFreeze the tumble
classNamestring""Classes applied to the container
styleReact.CSSPropertiesundefinedInline styles applied to the container
childrenReact.ReactNodeundefinedContent layered above the wireframe
shape"tetrahedron" | "cube" | "octahedron" | "dodecahedron" | "icosahedron"

Base polyhedron the wireframe is built from

Default"icosahedron"
detailnumber

Geodesic subdivision level (0-3). Each step splits every face into four, multiplying vertices and edges

Default0
stretchnumber

Elongation of the icosahedral vertex rings. 1.618 gives a perfectly regular icosahedron

Default1.28
zoomnumber

Scale of the solid within the frame

Default1
speednumber

Rate of the tumbling motion

Default1
wobblenumber

Amount the solid breathes in and out as it turns

Default0
showEdgesboolean

Render the glowing struts between vertices

Defaulttrue
edgeColorstring

Colour of the struts. Defaults to the inherited text colour, so it tracks the page theme automatically

Default"currentColor"
edgeGlownumber

Brightness of the strut glow

Default1
edgeThicknessnumber

Core radius of a strut. Larger values give a wider, softer line

Default0.02
showVerticesboolean

Render the bright dot at each vertex

Defaulttrue
vertexColorstring

Colour of the vertex dots. Defaults to the inherited text colour, so it tracks the page theme automatically

Default"currentColor"
vertexSizenumber

Radius of each vertex dot

Default0.032
vertexGlownumber

Brightness of each vertex dot, scaled by how many struts meet there

Default0.148
depthColorstring

Colour blended into the far side of the solid

Default"#7aa2ff"
depthTintnumber

How strongly depthColor is mixed into the receding side

Default0
depthFadenumber

How much the far side dims, adding a sense of volume

Default0
backgroundColorstring

Backdrop behind the wireframe. Transparent by default so it layers over whatever sits underneath; the glow is additive, so dark backdrops read best

Default"transparent"
brightnessnumber

Overall output gain

Default1
opacitynumber

Opacity of the whole wireframe

Default1
cursorInteractionboolean

Let the pointer tilt the solid as it hovers

Defaulttrue
cursorTiltnumber

Maximum tilt in radians applied by the pointer

Default0.35
dragToSpinboolean

Grab the solid and throw it, with momentum on release

Defaulttrue
spinFrictionnumber

How quickly a thrown spin slows down. Lower stops sooner

Default0.94
adaptiveQualityboolean

Drop render resolution automatically if the frame rate falls short

Defaulttrue
targetFpsnumber

Frame rate adaptive quality aims to hold

Default60
dprnumber

Upper bound on device pixel ratio

Default2
pausedboolean

Freeze the tumble

Defaultfalse
classNamestring

Classes applied to the container

Default""
styleReact.CSSProperties

Inline styles applied to the container

Defaultundefined
childrenReact.ReactNode

Content layered above the wireframe

Defaultundefined