# Tile Pattern Creator

A lightweight, browser-based tool to build a tile library and paint reusable patterns for tiling teams.

## Features
- Add tiles by color or optional image
- Paint patterns on a configurable grid
- Support rectangular tiles (multi-cell)
- Pin a floor tile row at the bottom
- Fill any row with a chosen tile
- Apply a brick-block layout across rows
- Auto-save tile library in the browser
- Import/export the tile library as JSON
- Export JSON for handing off to a tiler
- Export PNG snapshots
- Import JSON to continue a saved pattern

## Quick start
Open `index.html` directly in your browser, or use the optional local server script below.

### Optional local server (PowerShell)
```powershell
./scripts/serve.ps1
```

## Smoke check
```powershell
./scripts/smoke.ps1
```

## Pattern JSON format
```json
{
  "version": 2,
  "config": {
    "rows": 12,
    "cols": 12,
    "tileSize": 48,
    "floorEnabled": true,
    "floorTileId": "tile-abc"
  },
  "tiles": [
    {
      "id": "tile-abc",
      "name": "Sky Blue",
      "color": "#4c8bf5",
      "width": 2,
      "height": 1,
      "imageData": null
    }
  ],
  "placements": [
    { "id": "place-1", "tileId": "tile-abc", "row": 2, "col": 3, "width": 2, "height": 1 }
  ],
  "grid": [["tile-abc", null]]
}
```

## Tips
- Shift-click or right click to erase a tile.
- Enable “Floor row” to lock the bottom row to a chosen tile.
- Use “Fill row” to quickly paint a full row with a tile.
- Use “Apply brick” to stagger rows in a brick pattern.
- Tile library changes auto-save to your browser storage.
- If you use image tiles, keep images square for best results.