Gradient Background
58 resources ship this component · Motion & Effects
Also called: aurora, mesh gradient, animated gradient, noise, grain, gradient blob.
Ships it
- daisyUI · 68 pure-CSS Tailwind components as semantic class names, MIT, with 35 built-in themesComponent LibrariesS
- Grabient · Cosine-gradient generator; CSS/SVG/PNG export and a real llms.txtColorS
- HyperFrames · Apache-2.0 framework that renders HTML compositions to deterministic MP4, built for agentsGenerative Media ToolsS
- Paper Shaders · 30 zero-dependency canvas shaders as React components or vanilla JS, Apache-2.0Textures, Backgrounds & AssetsS
- Radiant · Zero-dependency generative shaders as single HTML files, embedded by iframeTextures, Backgrounds & AssetsS
- React Bits · 234 copy-paste animated React components: text effects, cursors, WebGL backgroundsMotion & InteractionS
- React Bits Pro · 703 paid React items in one license-gated shadcn registry: 134 animated components, 538 blocks, 11 templates and an Agent KitComponent LibrariesS
- remocn · 282 Remotion components for product-demo video, installed by the shadcn CLIMotion & InteractionS
- Shader Lab · Browser shader compositor with a WebGPU React runtime for exportTextures, Backgrounds & AssetsS
- UI TripleD · 282-item shadcn registry of motion components, sections and full pagesComponent LibrariesS
- 21st.dev · Community shadcn registry: 12,000+ React components, 48 templates, 48 themesComponent LibrariesA
- Aceternity UI · 132 motion-heavy React sections; 329 registry items; 17 paid templatesMotion & InteractionA
- Aceternity UI on 21st.dev · All 84 Aceternity components browsable side by side with copy-prompt and CLI installMotion & InteractionA
- affectUI · 93 React components, screens, and blocks for AI products, each one dependency-free fileAI Interface KitsA
- Animista · Pick-and-tweak CSS keyframe animations; copy only the ones you use, BSD-licensedMotion & InteractionA
- Annnimate · 80 copy-paste GSAP animation components for React, Vue and vanillaMotion & InteractionA
- beUI · 76 React motion components and AI agent UI, installed through a shadcn registryComponent LibrariesA
- beUI · 106-item Motion + Tailwind registry for React, shadcn-compatibleMotion & InteractionA
- Componentry · 62 animated React components plus 3 blocks, installed via the shadcn CLIMotion & InteractionA
- Cult UI · 82 free design-engineer components plus 10 paid full-stack AI startersComponent LibrariesA
- Grainient Shader Editor · Real-time shader gradient editor; customize and embed animated backgroundsTextures, Backgrounds & AssetsA
- Haikei · 15 browser generators that export blob, wave and gradient backgrounds as SVG or PNGTextures, Backgrounds & AssetsA
- HyperFrames Docs & Catalog · 515-page HyperFrames manual with a 375-block motion catalog and an llms.txt indexGenerative Media ToolsA
- Inspira UI · MIT animated components for Vue and Nuxt in the style of Aceternity UI and Magic UIMotion & InteractionA
- Kokonut UI · 45 animated shadcn-CLI components for landing pages, plus 7 paid templatesComponent LibrariesA
- Magic UI · 150+ animated shadcn-compatible React components for landing pagesMotion & InteractionA
- Pattern Craft · 257 copy-paste CSS background patterns and gradients, MIT licensedTextures, Backgrounds & AssetsA
- Radiant Shader Gallery · Browsable gallery of 87 free WebGL and Canvas 2D background effectsTextures, Backgrounds & AssetsA
- Shadcnblocks · 1,837 paid shadcn blocks and 19 Next.js and Astro templates, lifetime licenseBlocks, Templates & ThemesA
- Tamagui · Universal React styling engine, optimizing compiler and ~48 components for web and nativeComponent LibrariesA
- termcn · Terminal UI components for React, installed with the shadcn CLI, on Ink and OpenTUIComponent LibrariesA
- ThreeUI · Three.js hero components, shaders and landing-page templates with a Pro-gated remote MCP server — Community free, Pro $99/yr or $199 lifetimeTextures, Backgrounds & AssetsA
- Unicorn Studio · Browser tool that builds WebGL scenes and exports embeds for Framer, Webflow, or ReactTextures, Backgrounds & AssetsA
- unlumen UI · Freemium shadcn registry of Motion-driven React componentsComponent LibrariesA
- vgpu · Vercel Labs WebGPU library where one WGSL shader renders in the browser, headless in Node.js and as a CI snapshot testTextures, Backgrounds & AssetsA
- aengel.io Laboratory · 19 WebGPU and TSL experiments — compute fluids, raymarching, refraction — reference only, no source codeTextures, Backgrounds & AssetsB
- Animate UI · 73 motion-first React components shipped as a shadcn registryMotion & InteractionB
- Arlan's Vault · 18 web UI effects, each with a one-line spec, a live demo, and a copyable promptInspiration GalleriesB
- Dither Kit · Dithered React charts, avatars and gradients on one canvas engineComponent LibrariesB
- Easing Gradients · Fixes the hard edge on a CSS gradient by easing the colour mix, with an editor plus PostCSS and Sketch pluginsTextures, Backgrounds & AssetsB
- Eldora UI · 40 animated React components plus 16 landing-page blocks, shadcn-installableMotion & InteractionB
- Fancy Components · An MIT React library of microinteractions at 3,101 stars, organised by physics, text and image effect rather than by widgetMotion & InteractionB
- FeralUI · React interactions with ropes, paper, maps, and lightMotion & InteractionB
- 10 Framer Shader Presets · Ten copy-ready Framer shader configs with exact color, seed, speed, and noise valuesTextures, Backgrounds & AssetsB
- Gradient Lab · Free browser generator for animated gradient backgrounds, with PNG, 4K video, and live embed exportTextures, Backgrounds & AssetsB
- Hypercolor · 87 named Tailwind gradients plus mesh, grainy and world-flag generatorsColorB
- MetalForge · 400+ shader effects for SwiftUI, React Native, and the web, tuned with sliders and exported as codeTextures, Backgrounds & AssetsB
- MVPBlocks · 100+ copy-paste Next.js + Tailwind marketing and dashboard blocks, plus 7 templatesBlocks, Templates & ThemesB
- MVPBlocks (source repo) · BSD-3 source for the MVPBlocks block library and its Next.js docs siteBlocks, Templates & ThemesB
- Reverse UI · 68 animated React components built on Framer Motion, sold as a lifetime licenceMotion & InteractionB
- shadcn-glass-ui · Glassmorphism component set for React that installs through the shadcn CLIComponent LibrariesB
- ShapeFactory · Five free browser tools: logo maker, LAB palettes, LAB gradients, duotone, QR galleryColorB
- Shoogle · Search engine across 277 shadcn registries, with an MCP and CLI namespaceAgent Design ToolingB
- Soft Club UI · 118 Radix-based React components in a late-90s dark-glass aestheticComponent LibrariesB
- Spell UI · 33 animated React components — text reveals, WebGL backgrounds, embeds — via shadcn CLIMotion & InteractionB
- Spell UI (source repo) · MIT source for Spell UI: 33 React/Tailwind components served as a shadcn registryComponent LibrariesB
- Spell UI · 33 polished React + Tailwind components, MIT, shadcn-installableComponent LibrariesB
- Colorion Gradients · 37 hand-picked two-stop CSS gradients, one click to copy the CSSColorC