Seamless Pattern Generator
Create a pattern that repeats without seams: shapes, layout, colours, rotation, grain… then export the tile as PNG or SVG, the CSS code or a large image.
Shape
Silhouettes: Phosphor Icons (MIT) and Material Symbols (Apache 2.0), free to use. Licences
Import an image (logo, drawing, cut-out photo as transparent PNG…): it replaces the shapes and repeats with the chosen layout, size and rotation.
Motif colours
Export
SVG is not available with an imported image, grain or blur (pixel effects): use the PNG tile. CSS remains available, with the tile embedded as PNG.
The PNG tile code is very long: it is shortened on screen, but the button copies the full code.
Large images carry a small KSPNAI signature at the bottom right; the repeat tile has none, so it stays seamless.
Everything is computed in your browser: nothing is uploaded.
About this tool
This generator creates a pattern that repeats endlessly without visible seams: perfect for a website background, gift wrap, packaging, textile, a menu card or a social media visual. Everything updates live and runs in your browser.
Pick one or several shapes out of 300: geometric shapes (heart, star, drop, wave…) and silhouettes of people, animals, plants, food, objects, sport, the sea, Christmas and jobs or import your own motif, then the layout: grid, half drop, brick or random. Size, spacing, rotation, random variations, up to five colours on a background, opacity, grain and blur. The preview shows the repeated pattern and, if you wish, the outline of the tile.
- 300 shapes: geometric, people, animals, plants, food, sport, sea, Christmas, jobs… or your image
- Grid, half drop, brick or random layout
- Random rotation and size, up to 5 colours
- Grain, blur and opacity without breaking the repeat
- Tile export as PNG or SVG and ready-to-paste CSS
- Large image: screen, square, story, A4 300 dpi, 4K
How to use it
- Choose a shape (tick “Mix” to combine several) or import your motif.
- Set the layout, size, spacing and rotation.
- Choose the background and colours, or click Random colours.
- Export the tile (PNG, SVG or CSS) or a large image in the size you need.
Frequently asked questions
What is a seamless pattern?
An image (a tile) designed so that its edges match perfectly: placed side by side endlessly, no break is visible.
How do I use it as a website background?
Click “Copy CSS”: the code contains the pattern as SVG, its size and the background colour, ready to paste into your stylesheet.
Is the SVG always available?
Yes, unless you use your own image, grain or blur: the tile is then exported as PNG.
Can I use the patterns freely?
Yes, the patterns you create are yours. Large images carry a small KSPNAI signature at the bottom right; the tile has none.