Pillars
An interactive isometric grid where tiles rise into 3D pillars on hover, powered by the Canvas API.
Example
Component Props
| Prop | Type | Default | Description |
|---|---|---|---|
tileSize | number | 64 | Width of each isometric tile in pixels. |
maxRise | number | 48 | Maximum height a pillar can rise in pixels. |
hoverRadius | number | 4 | Hover effect radius in tiles. |
ease | number | 0.3 | Easing speed (0–1). Higher = faster. Frame-rate independent. |
fill | string | "#000" | Fill color for all tile faces. |
stroke | string | "#222" | Stroke color for tile edges (wireframe). |
cursorYOffset | number | 1.25 | Vertical cursor offset as a fraction of tile height. |
tileRatio | number | 2 | Width-to-height ratio of each tile. 2 = dimetric (pixel art style), ~1.732 = true isometric (30°). |