Developer
CSS pattern generator
Pure-CSS background patterns (stripes, dots, checkerboard).
- Instant
- Free
- Private (processed locally)
- No sign-up
Create a pattern
Pick the pattern, colors and size: the preview updates and the CSS code is ready to copy.
Available patterns
| Pattern | Technique |
|---|---|
| Stripes | repeating-linear-gradient |
| Dots | radial-gradient |
| Grid | linear-gradient × 2 |
| Checkerboard | repeating-conic-gradient |
Pure CSS, 100% local.
Frequently asked questions
Why CSS instead of an image?
It is lighter, crisp at any zoom, and scales losslessly with no network request.
How to use it?
Copy the CSS block and apply it to an element (or body) via a class.
Works everywhere?
The CSS gradients used are supported by all modern browsers.