Tile and plank floors

Each room in a project carries its own flooring spec — type (tile, hardwood, LVP, carpet, concrete), size or plank width, pattern (for tile), direction (for plank), grout width (for tile), color, and a product-name field. The 3D viewer reads the spec and renders the floor with the chosen pattern trimmed to the room's walls. The 2D canvas doesn't render the pattern — flooring is a 3D-view feature for v1 — but the spec is part of the project, so it saves, syncs, prints (in any sections that reference the floor takeoff), and follows the room across exports.

Tile patterns currently rendered as distinct layouts: stacked, 50/50, 70/30. Diagonal and herringbone are in the picker but render the same as stacked in the v1 3D viewer. Picking either stores the value on the room — when the renderer ships in a later build, existing projects with the pattern set will start rendering correctly with no migration step.

Where the flooring controls live

Open the entity panel and scroll to the Flooring section. On desktop it's in the right rail; on mobile it's in the entity info sheet. The section is at the room level, not on a selected fixture — you don't need anything selected, the room's spec is always editable.

The section opens with a Type dropdown at the top. Pick none to disable flooring; pick tile, hardwood, lvp, carpet, or concrete to enable the rest of the controls.

Tile floors

Pick tile as the Type. Three extra dropdowns appear:

• Tile Size — 12x12, 12x24, 24x24, 6x24, 6x6, 4x16, or 3x12 (inches). Default is 12x12.
• Pattern — stacked, 50/50, 70/30, herringbone, or diagonal.
• Grout Width — 1/16", 1/8", 3/16", or 1/4".

A Direction dropdown also appears when the tile size is NOT a square (12x12 and 6x6 look the same regardless of rotation, so they skip the field). Direction is Horizontal or Vertical — picks whether the long side of the tile runs along the X or Y axis of the room.

How each pattern lays out

Pattern	What the 3D viewer renders
stacked	Tiles in a regular grid — every row aligns. The simplest layout.
50/50	Tiles offset by half a tile width on alternating rows. Classic running-bond / brick pattern.
70/30	Tiles offset by one-third of a tile width on alternating rows. Each row shifts by 1/3 from the row below — gives a one-third running bond.
diagonal	Stored on the room but currently renders the same as stacked in v1. The 45°-rotated layout is on the v1 backlog.
herringbone	Stored on the room but currently renders the same as stacked in v1. The herringbone layout is on the v1 backlog.

Wall trimming

The pattern lays out tiles from a grid origin and then trims them to the room's wall bounds. A tile that runs past a wall is clipped at the wall edge — no overhang. Tiles entirely outside the wall bounds aren't rendered. This keeps the 3D floor looking like a real installation: tiles run continuously through the room, then stop at the perimeter.

The trim runs on every tile individually, so the rendered tile count scales with room size. There's a 2000-tile safety cap on the layout — rooms big enough to need more than 2000 tiles at the current size won't render the floor (the limit is there to prevent runaway mesh generation in the 3D viewer). If you hit it, increase tile size or decrease the room area.

Grout

The grout layer is a solid base under the tile grid, colored grey-on-light or grey-on-dark for contrast with the tile color (light grout under dark tile, dark grout under light tile). The Grout Width dropdown stores your spec on the room — the field follows the project to schedules and to the cabinet shop / installer. In v1, the 3D viewer renders all tile layouts with a fixed grout gap regardless of the dropdown's value; the chosen width still ships with the project so the install crew has the spec.

Hardwood and LVP plank floors

Pick hardwood or lvp as the Type. Two extra dropdowns:

• Plank Width — hardwood: 3.25", 5", 7". LVP: 3", 6", 7", 9".
• Direction — Horizontal or Vertical.

Plank length is fixed at 48" (1219 mm) in the rendering, with a 1/4" (6.35 mm) gap between adjacent planks for the seam. Real-world planks vary, but the 48" stock is a sensible default for the 3D preview.

The plank layout uses a stagger pattern — successive rows of planks shift by a random offset so the seams don't align row-to-row. That's the standard install pattern for hardwood and LVP.

Wall trimming works the same way as tile: planks running past a wall are clipped, planks entirely outside the wall bounds aren't drawn.

Carpet and concrete

Pick carpet or concrete as the Type. These don't have a pattern, size, or direction — they render as a solid floor in the chosen color. No extra dropdowns appear beyond the color row.

Color

A row of preset color swatches sits below the type-specific options. Swatches are organized by family: whites and creams, light wood and beige, mid woods, dark woods and walnut, greys, dark colors, statement colors. Click a swatch to apply it as the floor color.

The Color row is shared across all flooring types (tile, hardwood, LVP, carpet, concrete) — the active type just interprets it differently:

• Tile: tint color of the tiles (grout adjusts for contrast against the tile).
• Hardwood / LVP: tint of the planks (gap color adjusts for contrast).
• Carpet / concrete: solid floor color.

Product name

A free-text Product Name field lets you record the specific tile or flooring product — for example Wickham Maple Natural 5" or Daltile Volcanic 12x24 Grigio. This is purely informational; it shows up in the fixture / materials schedule when the print includes those sections.

Per-room flooring

Each room (each ProjectRoom) has its own flooring spec. Switching rooms via the Rooms tab bar reads that room's flooring back — change the active room and the Flooring section in the entity panel updates to match.

Steps (desktop)

1. Open the entity panel on the right rail. The Flooring section is below the room info.
2. Pick a Type from the dropdown.
3. Set type-specific options — tile size + pattern + grout for tile, plank width + direction for hardwood / LVP, nothing extra for carpet / concrete.
4. Click a color swatch from the Color row.
5. Optionally type a Product Name for the schedule.
6. Switch to the 3D View from the app bar to see the rendered floor.

The 3D view re-renders from scratch each time you open it, so any flooring change you made in the editor will be reflected the next time you open the viewer for that room.

Steps (mobile / tablet)

1. Tap the entity info floating action button at the bottom-right to open the entity sheet.
2. Scroll to the Flooring section.
3. Pick a Type, set the type-specific options, tap a color swatch, optionally type a Product Name.
4. Tap 3D View in the app bar to see the rendered floor.

Tips

• The 2D canvas doesn't render the flooring pattern — that's intentional for v1. The 2D editor is for drafting; the 3D viewer is for previewing the result. Drafting performance stays fast because the canvas isn't filling thousands of tiles every frame.
• The 2000-tile cap on the tile layout is generous for normal residential rooms. A 12 ft × 15 ft room at 12 × 12 tiles is about 180 tiles. You'd need a very large room with very small tiles to hit the cap.
• For 12x12 and 6x6 tile sizes, the Direction dropdown is hidden because square tiles look the same regardless of orientation. If you want a direction effect on those sizes, switch to a non-square size like 12x24.
• The diagonal and herringbone options are in the picker now so projects can pre-commit to the pattern before the renderer lands. When the renderers ship in a later build, projects you set today will start rendering correctly automatically — no migration step.
• The Direction setting rotates the whole tile layout 90° if Vertical is chosen, applied on top of whichever pattern is set.
• Hardwood and LVP planks always render with the random-stagger pattern. There's no "stacked plank" option — that's not how plank flooring is installed in practice.
• Set floor color to white (White swatch) for an installer-friendly print where the tile color is implied by the Product Name field rather than the rendered color.