Left-drag paint Middle-drag move 🖐 Wheel zoom 🔍
Zoom
Tile Grid tiles

Add colour

From RAL Classic
Hex
 
Name (optional)

🖼 Image → tiles

Palette source
Suggested colours: 8
Suggested palette
Fit
Brightness 0
Contrast 0
Preview
Processed entirely in your browser — the image is never uploaded.

How to use

1 · Set up the area

Enter Width & Height (m), Tile size (m/cm/mm) and Gap (m/cm/mm/% of tile), pick a gap colour, then press Apply size. Edge tiles are cut realistically.

2 · Build the palette

+ Add colour → choose a RAL Classic value or type a hex. Double-click a swatch to edit, ✕ to delete. Each row shows a live tile count.

3 · Paint

Brush Bclick / drag to paint
Rect Rdrag a filled rectangle
Fill Gflood-fill a same-colour region
Pick Eeyedropper — grab a tile's colour
Erase Xback to gap colour
Undo / RedoCtrl+Z / Ctrl+Y

4 · Image → tiles

🖼 Image → tiles turns a photo into a tile layout. Each tile is matched to the nearest palette colour (perceptual CIELAB match). Choose Use current palette to map onto the colours you already have, or Suggest colours from image to extract a palette — these can be snapped to the nearest RAL so they stay orderable. Adjust fit, brightness/contrast, and optional dithering, watch the live preview, then Apply (undoable). The image is processed entirely in your browser — nothing is uploaded.

5 · Navigate

Middle-dragpan the area anywhere
Mouse wheelzoom (anchored on cursor)
Fitfit & centre the whole area
⟳ Rotateturn the area 90°

6 · Field map for the installer

Label tiles (on by default): every tile shows its number (big, centred) with RAL and hex in the bottom-right — like a periodic-table cell. The palette is the matching legend. Print outputs the layout plus a legend table (number, swatch, RAL, hex, name, tile count) — hand that to whoever lays the tiles.

7 · Save · share · export

Save / Load a .json design · Copy share link packs the whole design into a URL · export PNG or SVG · 🖨 Print design (layout + legend) or 🖨 Print legend (legend table only) — both open the print dialog (pick a printer, or “Save as PDF”). Your work also auto-saves in this browser.

Privacy & licence

Runs 100% in your browser — no server, nothing is uploaded, no tracking, and it works offline. Designs stay on your device (browser storage, files you save, or links you choose to share).

Tile Designer · Copyright © 2026 Marc Pfaendler. Free software under the GNU Affero General Public License v3 or later (AGPL-3.0) — this page is its complete source code. Comes with absolutely no warranty.

⚠️ AI-generated software, provided “as is”, no liability — verify colours and measurements before ordering or installing. RAL values are on-screen approximations, not colour-accurate to physical tiles/paint.