Floor Plan Sketcher

Draw walls, place furniture, and export your room layout — all in the browser.

Room Size

Tools

Furniture

Zoom:100%

Click an item to select it, drag to move

2.0m

Floor Plan Sketcher uses the HTML5 Canvas API — no data leaves your browser. Set your room dimensions to draw the outer boundary, then switch to Draw Wall mode to add interior walls by clicking two points. Use the Furniture palette to drop pre-sized items onto the canvas, then Select / Move to drag and rotate them. Save your work as JSON to resume editing later, or export as PNG to share. 1 grid cell = 0.5m.

About This Tool

How to Use
  1. Set your room dimensions to create the outer walls
  2. Select Wall mode and click to draw interior walls
  3. Choose furniture from the palette and click to place
  4. Drag items to reposition, use rotation buttons to orient
  5. Export your plan as PNG or save as JSON to edit later
Common Use Cases
  • Planning furniture layout before moving to a new apartment
  • Sketching room arrangements for interior design projects
  • Creating simple office layout proposals
  • Visualizing space usage for renovation planning
  • Sharing room ideas with roommates or partners
Tips & Tricks
  • Enable grid snap for perfectly aligned walls and furniture
  • Use the zoom controls to work on detailed areas
  • Save your plan as JSON to continue editing later
  • Set room dimensions first to get accurate measurements
  • All drawing happens locally — nothing is uploaded anywhere

You might also like

Placeholder Image Generator

Generate custom placeholder images for mockups and wireframes in the browser. Set dimensions, background color, text color, and custom label text, then download as PNG or copy the data URI for use in HTML and CSS.

Device Mockup Generator

Wrap any screenshot inside a realistic device frame — iPhone, MacBook, iPad, or Android. Choose frame color and background, then download the composed mockup as a PNG for portfolios, presentations, or app store assets.

SVG Optimizer

Clean and minify SVG files by removing comments, metadata, empty elements, and unnecessary whitespace. Paste SVG code or upload a file and see before/after size savings.

Font Previewer

Preview and compare popular Google Fonts side by side. Search and filter by category, adjust font size and weight, enter custom preview text, and compare up to four fonts simultaneously to find the perfect typography for your project.