Geometric Patterns
Grids of tiles with geometric shapes, even or nested. Edit any single tile, export as SVG, CSS or image.
Open the generatorRuns right in your browser. Your graphics are made on your device.
Start from a preset
Pick a preset and it opens right in the editor, ready to adjust.
What is it?
A geometric pattern is a grid of tiles, each holding one simple shape: circles, quarter circles, triangles, stars or arcs. Rotation and color changes turn a handful of shapes into lively surfaces, familiar from Bauhaus posters, tiles and quilts. Such patterns work well for website backgrounds, slides, packaging and social media graphics.
How it works
Pick a shape pack or put together your own shapes. Set the number of tiles per row, choose an even or nested grid and how shapes rotate. Color the tiles at random from your palette or per shape layer, with or without tile fills. Press the space bar for new variations. Click a tile to change its shape, color and rotation. Export as SVG, as a CSS background or as an image.
Try the Geometric Patterns nowFAQ
- Can I change single tiles?
- Yes. Click a tile in the preview, or reach it with Tab and the arrow keys and press Enter. The popup lets you swap shape, color and rotation. Edited tiles survive new variations and travel with share links and saved designs.
- What is the difference between an even and a nested grid?
- Even means all tiles have the same size. In a nested grid every tile splits into four smaller ones with the chance you choose, up to four levels deep. The result is a mosaic of large and small tiles.
- Does the pattern tile seamlessly?
- Yes. The grid always fills the canvas with whole tiles, so the full design repeats without a visible edge. The CSS export uses it as a background with background-repeat.
- What are the tile shapes and quarter turns for?
- The shapes of the “Tiles and quarters” pack meet the tile edges at fixed points. With quarter turns neighbouring tiles connect, which creates mazes and arc patterns in the spirit of Truchet tiles.
- May I use the patterns freely?
- Yes. Musterli drew every shape itself. You can use your exports privately and commercially, without an account and without watermarks.
Related generators
All generators in PatternsSeamless Patterns
Seamlessly tiling patterns made of shapes or your own graphic. Export as SVG, CSS, tile or image.
Open in editorGrid Patterns
Grid lines, dot grids, crosses or tiles with major and minor grids. Export as SVG or image.
Open in editorConfetti
Confetti made of strips, circles, triangles and squiggles, evenly spread. Export as SVG or image.
Open in editorDieter Dots
Concentric rings of dots, like a perforated speaker grille. Export as SVG or image.
Open in editorCSS Patterns
Over 30 pure CSS patterns: dots, grids, stripes, waves and geometric shapes. Export as CSS, Tailwind, SVG or image.
Open in editor