FRENAR
N°02 · Canvas 2D · Algorithmic Heritage

Generative Zellige

Moroccan zellige revisited through code. Rotational symmetries, aperiodic tilings, earth-tone palettes — each seed produces a unique piece, never a duplicate.

adjust parameters · click to reseed
// Zellige génératif — pavage symétrique paramétrique
const palettes = [
  ['#1a5276','#d4e6f1','#154360','#85c1e9'], // Fès
  ['#b8863b','#e9d9b0','#a2432f','#f5ecd9'], // Marrakech
  ['#c8f135','#0a0a0a','#9a9a9a','#1a1a1a'], // Digital
];

function drawTile(cx, cy, radius, symmetry, rand) {
  for (let i = 0; i < symmetry; i++) {
    const angle = (Math.PI * 2 / symmetry) * i;
    ctx.save();
    ctx.translate(cx, cy);
    ctx.rotate(angle);
    // Tracé du motif unitaire (triangle + arcs)
    drawMotif(radius, rand);
    ctx.restore();
  }
}
Your turn

Push symmetry to 12 with the Fès palette — can you find the 12-pointed stars typical of the Meknes fountains? Compare with symmetry 6 and note the difference in visual rhythm.

Want to create your own generative patterns?

Book a session