component
Aero Shards
By Framer Expert WebDesigner

Details
- Framer Expert WebDesignerAuthor
- componentType
- 2026-09-10Published
- 2026-09-10Updated
- 2026-09-10Added
- InteractionsCategories
Summary
Aero Shards renders thousands of individually lit glass shards streaming along procedural flow paths, entirely on the GPU.
Description
Aero Shards renders thousands of individually lit glass shards streaming along procedural flow paths, entirely on the GPU. Choose a Stream, Vortex or Ribbon formation and the same shards morph between them without ever restarting the animation. Three material finishes — Pearl, Chrome and Satin — carry their own lighting model, and the whole field reacts to the cursor: shards repel or attract with damped, flow-aligned motion, clicks send an accent-coloured ripple across the sculpture, and pressing and holding gathers a softly circulating cloud that unfurls on release. Every parameter is a Property Control. Palette, placement, flow, material, detail, density, speed, spin, turbulence, spread, depth, glow, bloom, grain, chromatic aberration, edge softness and the full interaction model are all adjustable from the panel, with no code required. Lighting and bloom adapt automatically to light backgrounds, so the sculpture reads correctly on white as well as on near-black. It is built for real projects. The component is completely static on the Canvas, in exports and in thumbnails, so it never slows the editor or tiles an export. It honours prefers-reduced-motion, pauses when scrolled offscreen or when the tab is hidden, scales its shard count to the device, and falls back to a styled static element on browsers without WebGPU. Placement keeps a content-safe region so headlines and buttons stay readable on top. Features Three flow formations that morph continuously — Stream, Vortex, Ribbon Three physically distinct materials — Pearl, Chrome, Satin Cursor repel / attract, click ripples, and press-and-hold gathering Optional Dither and ASCII stylization rendered fully on the GPU Adapts automatically to light and dark backgrounds 32 Property Controls, logically grouped, with descriptions on complex options Static on Canvas, in exports and in thumbnails; respects reduced motion Graceful static fallback when WebGPU is unavailable
Introduction
Sculpture of drifting glass shards
Rank history
Daily rank per list, from the first snapshot — lower is better.
- All · #5328