How to use mesh gradient backgrounds
Mesh-style gradients blend multiple overlapping colour areas rather than following one straight line. Use them for expressive website backgrounds, hero graphics and cards.
Our native CSS mesh designs layer radial gradients. Check the actual background behind each line of text.
Choose CSS for a website background or export PNG, JPG, SVG or WebP for your project. The exporter includes Full HD, 4K, square, story and phone presets, plus custom sizes. Some SVG designs contain raster artwork; output dimensions do not increase their source detail.