The Vibeary — tag

background

24 resources in The Vibeary tagged "background" — tools, libraries and references pulled from across the library's shelves, each one checked by hand before it was added.

Gems in this collection

Preview of ggglitch

ggglitch

Generates glitchy, displaced shape backgrounds with RGB-split and slice effects as SVG.

fffuelfree
Preview of ssscribble

ssscribble

Generates background scribble textures as lightweight SVG line art, with controls for density, roughness and stroke weight.

fffuelfree
Preview of Animated CSS Patterns

Animated CSS Patterns

Animated variants of the css-pattern collection: moving CSS-gradient backgrounds with no JS or images.

Temani Afif (@ChallengesCss)free
Preview of CSS Pattern

CSS Pattern

157 background patterns built entirely from CSS gradients, each parameterised with custom properties for size and colour.

Temani Afif (@ChallengesCss)free
Preview of tsParticles

tsParticles

TypeScript particle engine with presets for confetti, fireworks, links and polygon masks, plus React, Vue, Svelte and Angular wrappers.

Matteo Bruni (@matteobruni)MIT
Preview of God Rays Generator

God Rays Generator

Single-purpose generator producing volumetric god-ray light beam graphics with adjustable angle, spread and colour.

MagicPatternfree
Preview of ooorganize

ooorganize

Grid pattern generator covering dot, line, cross and mixed grid backgrounds as SVG.

fffuelfree
Preview of SVG Backgrounds

SVG Backgrounds

Collection of customisable SVG backgrounds, shape dividers, doodles and preloaders with export presets for Webflow, Elementor and plain CSS.

Matt Visiwigfreemium
Preview of bbblurry

bbblurry

Creates soft blurry blob background shapes exportable as SVG, sized and coloured in the browser.

fffuelfree
Preview of hhholographic

hhholographic

Generates iridescent holographic background gradients with adjustable hue sweep and grain.

fffuelfree
Preview of hhhorizon

hhhorizon

Cyberpunk-inspired SVG background generator combining horizon grids, glow gradients and scan lines into a single exportable file.

fffuelfree
Preview of Cool Backgrounds

Cool Backgrounds

Aggregated generators producing triangle mesh, particle, topographic gradient and photo-based hero background images for download.

Side Project Collectivefree
Preview of wwwatercolor

wwwatercolor

Generates soft watercolour-style background washes as SVG using layered filter effects.

fffuelfree
Preview of meshgrad

meshgrad

Generates CSS mesh gradients as layered radial-gradient stacks, with a React helper for randomised output.

Cristi Cretu (@cristicretu)MIT
Preview of ShaderExpo

ShaderExpo

Browser WebGL shader playground for writing, previewing and sharing fragment shaders used as page backgrounds.

Anurag Hazra (@anuraghazra)MIT
Preview of canvas-nest.js

canvas-nest.js

Tiny canvas script that draws an interactive connected-node particle mesh behind page content, configured via script tag attributes.

Hu Chen (@hustcc)MIT
Preview of particles.js (marcbruederlin)

particles.js (marcbruederlin)

Dependency-free responsive particle background plugin with configurable density, connection lines and interaction modes.

Marc Brüderlin (@marcbruederlin)MIT
Preview of aaabstract

aaabstract

Abstract holographic background generator producing layered iridescent SVG artwork you can recolour and export at any size.

fffuelfree
Preview of Hero Patterns

Hero Patterns

Library of tileable SVG background patterns with live foreground colour and opacity controls, copied out as data-URI CSS.

Steve Schoger (@steveschoger)free
Preview of Images in motion

Images in motion

Tiny open-source mosaic of inclined image columns that scroll opposite ways, driven by one CSS keyframe per lane with optional React and Vue mounts.

smartsquadMIT
Preview of topolines

topolines

One React component that draws animated topographic contour backgrounds on the GPU, with six presets and a live playground.

Alex (@idleCyrex)MIT
Preview of Topo

Topo

Browser generator for topographic contour-line patterns with adjustable parameters and export, for backgrounds, posters and section dividers.

Unknownfree
Preview of instantshader

instantshader

Zero-dependency WebGL library for animated mesh-gradient backgrounds: seamless loops, mounts to any element, exports frames.

@ugo_buildsMIT
Preview of Gradient Magic

Gradient Magic

Gallery of unusual CSS gradients including patterned, striped and repeating conic effects, each with copyable source.

(@GradientMagic)free