Components / Backgrounds
Backgrounds
23 components · 13 at 0 B
Ambient fields, grids, dots, grain, rings and beams behind content.
Aurora Background
BackgroundsAmbient gradient field: three soft colour fields drifting at three coprime speeds, a slow hue rotation so the colours themselves move, and a film-grain layer stepped at 12 fps.
Border Beam
BackgroundsA beam of light travels around the edge of a card.
Dot Pattern
BackgroundsA field of dots behind content, faded toward the edges, with an optional slow pulse.
Dotted Map
BackgroundsA world map drawn as a grid of dots, with markers that pulse.
Grid Pattern
BackgroundsA hairline grid behind content, faded toward the edges, optionally drifting one cell at a time.
Noise
BackgroundsFilm grain over a gradient or image, blended and flickering at 12 fps.
Orb
BackgroundsA sphere of light that breathes and slowly turns its colour.
Orbiting Circles
BackgroundsThe children orbit the centre of their parent and stay upright.
Particles
BackgroundsA field of drifting dots that part around the cursor, on a canvas that draws only while on screen in a visible tab.
Progressive Blur
BackgroundsAn edge that blurs what scrolls under it, more the closer it gets: a few bands, each with a backdrop blur twice the last and a mask that keeps it to its own slice, so the blur ramps instead of stepping.
Ripple
BackgroundsRings expand from a point and fade, one after another, like a pulse.
Dither
ProDraws slow noise waves on the GPU, ordered-dithered into pixel cells of one colour on the page's ground, for the look of a 1-bit screen.
Moves thousands of particles along an invisible current, leaving fading trails.
Hyperspeed.
hold to jump
Hyperspeed
ProDraws a jump to light speed: streaks of light rush out of a vanishing point, longer and brighter toward the edge, in one colour with a hot head in a second tone.
Plasma
ProDraws glowing ribbons of light drifting through each other: four sine fields interfere on the GPU, the sum folds into soft bands, and each band glows in a colour sliding between two tones with a hot core at its peak.
Silk
ProDraws a sheet of fabric drifting in slow folds, lit from one side: a warped height field on the GPU, normals from finite differences, a diffuse body in the colour and a narrow sheen in a second tone.