Escher tessellation generator

Turn a plain polygon into a puzzle-like tile that fills the plane with no gaps. Pick one of 81 tile types, bend the edges, colour the tiles — and export a seamless pattern as SVG, PNG or CSS.

Open in the generator How it works

Interlocking curved tiles in teal, orange and yellow fitted together without gaps

What is an Escher tessellation?

A tessellation, or tiling, covers a surface with copies of shapes, with no gaps and no overlaps. The Dutch artist M. C. Escher (1898–1972) made the idea famous by turning the tiles into birds, fish, lizards and other creatures that fit together perfectly.

Behind such drawings stands strict geometry: the shape of one edge of a tile decides the shape of its neighbour.

How the generator builds them

Ornamatic uses isohedral tilings: every tile is a copy of the same shape, and every tile has the same surroundings. There are 93 types of such tilings, labelled IH1 to IH93; Ornamatic offers 81 of them, using Craig S. Kaplan’s tactile-js library.

In each type the edges of the tile are tied together by the symmetry of the tiling. Bend one edge, and its partner edge bends in exactly the matching way — so the copies still fit together without gaps, however wavy the outline becomes.

What you can adjust

Tile type — 81 types, from near-regular grids to unusual shapes.
Edge curvature — from straight edges to strongly wavy ones.
Tile shape parameters — many types have free parameters that change the proportions of the tile.
Segments — one or two bends per edge for richer outlines.
Rendering — filled tiles, tiles with a seam line, or outlines only.
Colours — the tiles are coloured with up to three colours, from any palette.