Backgrounds & Atmosphere

Gradients, grids, noise, patterns and animated backdrops that set the mood behind your UI.

Live in this category

3 components

Pure CSS

Mesh Gradient

Gradient Mesh

Featured

Gradient border card

One pixel of brand colour around the edge, no extra wrapper divs.

Gradient Border

Dot pattern surface

Dot Pattern

Bookmark sites — saved only in your browser on this device

orbs.jakubantalik.com

Floating orb field

BackgroundsFreeWebGLGLSL

by Jakub Antalík

shapefactory.co

Gradients, blobs and brand shapes

BackgroundsFreeSVGDesign

bg.ibelick.com

Copy-paste Tailwind backgrounds

BackgroundsFreeTailwindCSS

by Julien Thibeaut@ibelick

jitter.video

Animated background templates

BackgroundsFreemiumLottieVideo

haikei.app

Generate SVG shapes, blobs and waves

BackgroundsFreeSVG

heropatterns.com

Repeatable SVG background patterns

BackgroundsFreeCSSSVG

magicpattern.design

Pattern, gradient and mesh generators

BackgroundsFreemiumCSSSVG