# LED Bloom Aperveil / Light, shaped for the web. Collection: Premium (Aperveil Shaders and Aperveil Pro) · Coming soon. An LED-wall background for React: a pinwheel of silver-white light sprays outward from its center like vapor, seen through soft square LED cells, in WebGPU. [Aperveil integration guide](https://www.aperveil.com/docs) ## What it does LED Bloom paints a pinwheel of overlapping petals of silver-white light that meet in thin seams at its center, measured from a reference still, and shows it on an LED wall: soft square cells, a little uneven, whose gaps the brightest light floods. Its paint sprays outward from the center like vapor: the petals curl and drift as they travel, come out in puffs that spiral away and thin before they spread far, while new paint keeps coming from the middle. The pointer scatters the LEDs: the cells round it are tossed outward, each a little its own way and a little smaller, leaving a dark clearing with the wall's light thrown to its edge, and they fall back into place when it moves on. Hover set to Glow lights the cells under the pointer instead. ## Choose it for Give a music, event or creative-studio page an energetic hero: the bloom sits beside the copy and the LED grid reads as a stage screen. ## Limits LED Bloom shows its own bloom of light; it does not put your images or video on the LED wall, and it is not a physical fluid simulation. ## Current look Default. Color Looks change colors only; motion, geometry and typography remain unchanged. [Open editor](https://www.aperveil.com/shaders/led-bloom/edit?look=default&scene=landing) ## Landing scene This preview uses `position`: [0.78,0.5], `reach`: 1.1. The editor link carries these settings with your Look, except the placement: the editor keeps the shader centred. Direct editor visits use the product defaults; Reset all restores those defaults. ## Install LED Bloom is part of Aperveil Shaders and Aperveil Pro, coming soon. Its live demo is open; installation and downloads open in a later release. Free shaders install today: see the [Aperveil integration guide](https://www.aperveil.com/docs). ## Controls - Red (`colorRed`, color): The red of the bloom. - Orange (`colorOrange`, color): Its orange. - Rose (`colorRose`, color): Its rose. - Yellow (`colorYellow`, color): Its yellow. - Green (`colorGreen`, color): Its green. - Sky blue (`colorSky`, color): Its sky blue. - Deep blue (`colorBlue`, color): Its deep blue. - Violet (`colorViolet`, color): Its violet. - Shadow (`shadowColor`, color): The dark wedges between the petals. - Core (`coreColor`, color): The pale petals, and the light where they meet. - Background (`background`, color): What the picture fades into at the edges. - Position (`position`, xy): Where the vanes meet. - Twist (`twist`, slider): An extra turn of the petals as they run outward, on top of their own. - Reach (`reach`, slider): The size of the bloom: how far the color reaches before fading into the background. - Cells (`cells`, slider): How many LED cells span the height of the frame. - Gap (`gap`, slider): How dark the gaps between the cells are. - Bleed (`bleed`, slider): How much bright light floods over the gaps. - Pixelate (`pixelate`, slider): How much each cell shows one color, as a true LED does, rather than the soft picture under it. - Speed (`flowSpeed`, slider): How fast the pinwheel turns and its vanes breathe. - Pointer (`interaction`, slider): How strongly the pointer acts on the wall: how far it scatters the LEDs, or how brightly the cells under it glow. - Hover (`hoverMode`, select): What the pointer does: Scatter tosses the LEDs round it outward, opening a dark clearing with the colors thrown to its edge; Glow lights the cells under it. - Spray (`spray`, slider): How strongly the paint sprays outward from the center like vapor: its colors curl and drift, and it comes out in puffs that spiral away. At 0 the bloom only turns. - Opacity (`opacity`, slider): default 1 - Background opacity (`backgroundOpacity`, slider): Fade the background independently for transparent overlays. ## Compatibility WebGPU rendering requires a supported browser and secure context: Chrome and Edge (Windows, macOS and ChromeOS; Chrome on Android 12 or newer), Safari 26 (Mac, iPhone and iPad) and Firefox (Windows (from 141) and Apple silicon Macs (from 145)). Firefox on Linux, Android and Intel Macs is still rolling it out (checked October 2026). The landing shows a real poster for the selected Look when live rendering is unavailable. The standard exported component does not bundle a poster fallback. Supply your own fallback in the host layout. ## Performance 4.063 ms GPU timestamp median; p95 8.913 ms. 1440x900 @ dpr 1.5; Apple M2 (8-core GPU), Metal driver on macOS Version 26.6.2 (Build 25G83); measured 2026-10-18. This is a recorded headless sample, not a browser FPS or mobile-performance guarantee. ## Questions ### How fine is the LED grid? Cells sets how many LEDs fit in the frame's height (200 by default), Gap how dark the gaps between them are and Bleed how far bright light floods over them. Pixelate moves each cell from soft toward a single flat color. ### Can I stop the spray and keep only the turning bloom? Yes. Spray sets how strongly the paint sprays outward like vapor; at 0 the bloom only turns slowly. ### What does the pointer do? It scatters the LEDs round it: the cells are tossed outward, each a little its own way, opening a dark clearing with the light thrown to its edge, and they fall back as it moves on. Pointer sets how far. Set Hover to Glow and it lights the cells under it instead; the bloom itself stays where it is placed. ### What happens without WebGPU? This landing shows a still poster of your selected Color Look. The raw WGSL needs a WebGPU host. Landing posters are not bundled in the Export Kit: add your own fallback around the exported component. ### Can I use this shader commercially? Part of Aperveil Shaders and Aperveil Pro · Coming soon. The live demo is open; editing and downloads open in a later release. Free shaders and blocks are available now. Follow the license notices supplied with the source you download. Commercial use comes with Aperveil Shaders or Aperveil Pro: the proposed individual license covers one developer on unlimited permitted personal, client and SaaS interface projects. ## License Part of Aperveil Shaders and Aperveil Pro · Coming soon. The live demo is open; editing and downloads open in a later release. Free shaders and blocks are available now. Follow the license notices supplied with the source you download. Commercial use comes with Aperveil Shaders or Aperveil Pro: the proposed individual license covers one developer on unlimited permitted personal, client and SaaS interface projects. ## Related shaders - [Dot Grid](https://www.aperveil.com/shaders/dot-grid) - [Kaleidoscope](https://www.aperveil.com/shaders/kaleidoscope) - [Spiral](https://www.aperveil.com/shaders/spiral)