# Backgrounds

> Decorative gradients, grids, patterns and shaders.

- [Halftone Field](https://www.assembli.design/components/halftone-field.md): Print-style canvas backdrop: a staggered dot lattice whose dot sizes ride flowing interference waves, swelling under the cursor. Pauses off-screen, adopts the text colour, and freezes for reduced motion.
- [ASCII Field](https://www.assembli.design/components/ascii-field.md): A canvas grid of characters that swells and brightens around the pointer and drifts with an ambient wave.
- [Dot Grid Ripple](https://www.assembli.design/components/dot-grid-ripple.md): Canvas dot matrix that reacts to you: the pointer swells nearby dots and every click sends a shockwave rippling through the grid. DPR-aware, pauses off-screen, reads the text colour so it follows light and dark.
- [Flow Field](https://www.assembli.design/components/flow-field.md): Thousands of fading particles tracing a slowly evolving noise field on canvas, with the pointer bending the current.
- [Goo Cursor Field](https://www.assembli.design/components/goo-cursor.md): A trailing chain of blobs fused by an SVG gooey filter. The head follows the pointer, each blob chases the one before it, and they melt together.
- [Gradient Blobs](https://www.assembli.design/components/gradient-blobs.md): Slow, organic mesh-gradient background: four blurred colour blobs drift on offset loops, with a fine grain overlay that kills banding. Takes any palette, static when motion is reduced.
- [Iso Wave Field](https://www.assembli.design/components/iso-wave-field.md): Isometric field of pillars that breathes in slow interference waves. The pointer raises a swell beneath it and each click sends a ripple ring across the grid. Drawn back to front on a 2D canvas with three shaded faces per pillar; wraps any content as a hero background.
- [Pixel Trail](https://www.assembli.design/components/pixel-trail.md): A pixel grid that lights up under the cursor and decays cell by cell, leaving a fading mosaic wake. Canvas-based, DPR-aware, theme-aware.
- [Aurora Backdrop](https://www.assembli.design/components/aurora-backdrop.md): Section background of four blurred color fields drifting on independent loops over a radially masked dot grid; blends correctly in light and dark mode and holds still for reduced motion.
- [Beam Grid](https://www.assembli.design/components/beam-grid.md): Blueprint grid fading out from the center while comet-tailed beams of light race along random grid lines in both axes; deterministic placement, no beams for reduced motion.
- [Constellation Field](https://www.assembli.design/components/constellation-field.md): Canvas starfield whose drifting points join with threads when they pass close. The cursor pushes stars aside and casts accent-colored threads of its own. Theme-aware, reduced-motion safe.
- [Dot Matrix Wave](https://www.assembli.design/components/dot-matrix-wave.md): Canvas dot field with a slow diagonal swell and a liquid lens that inflates dots around the cursor; follows the theme via currentColor, DPR-aware, and draws a single frame for reduced motion.
- [Grain Gradient](https://www.assembli.design/components/grain-gradient.md): Risograph-style mesh gradient: four radial color fields slide and rotate past each other beneath heavy SVG film grain and a soft vignette, for editorial heroes and posters.
- [Retro Grid](https://www.assembli.design/components/retro-grid.md): Synthwave floor: a perspective grid scrolls toward the viewer beneath a striped sunset sun and a glowing horizon line. Configurable cell size, speed and neon color.
- [Topo Lines](https://www.assembli.design/components/topo-lines.md): SVG topographic contour rings generated from layered sine terrain that slowly breathe and shift, with heavier index contours every fifth line; uses currentColor so it suits both themes.
- [Warp Starfield](https://www.assembli.design/components/warp-starfield.md): Canvas starfield streaming toward the viewer that eases into hyperspace when hovered or focused: stars stretch into streaks with motion trails, then settle back to cruise.

Back to [all components](https://www.assembli.design/components.md).