HtmlDrag
A freeform canvas for any HTML (no grids, no wireframes)
Start new thread

Edit complex HTML visually without losing the structure

by
•

Existing HTML can look complete in a browser and still be difficult to edit. The challenge becomes clearer when one file combines standard HTML with SVG, Canvas, IFrame content, positioned elements, and nested tables.

HtmlDrag gives teams a visual finishing workflow for existing HTML. Upload a file, import a URL, or paste code, then establish a baseline with ordinary content before checking the special structures.

The important distinction is the editing layer. You can select and adjust standard HTML, treat Canvas as a visual surface, inspect local IFrame content within its document boundary, and test nested content at the correct level. The final step is to preview, save, copy, or export the result.

This update is based on the Structure Lab demo. It does not claim that every Canvas pixel or cross-origin IFrame can be freely rewritten. It shows how a visual HTML editor can make both editable surfaces and structural boundaries easier to understand.

25 views

Add a comment

Replies

Best

Interesting approach.

I think the biggest value is being able to make visual changes without breaking the existing HTML structure. That's a common pain point, especially when working with older or more complex layouts. Great job!

 Thanks, Hossein — that’s exactly the pain point we wanted to address: making visual changes without losing the existing HTML structure. Appreciate you checking it out!

curious about the handoff after export. if a teammate opens the saved HTML later and flags one nested-table cell or iframe state, does HtmlDrag keep a ref that maps back into the editor, or is it still screenshot + explanation?

the Structure Lab demo would be a pretty clean way to test one outside-review round.

 Great question. You can upload the exported HTML again for another review, but we don’t currently keep a review map between sessions. For now, a screenshot or short note helps identify the exact element.

  ah, that's the bit i was trying to pin down. would you be up for a tiny PreApp cross-test with the public Structure Lab demo? one outside reviewer marks a nested-table cell or iframe state, then we check what the original agent can actually pull back. no client file, just one note.

 Thanks, Eason. We currently can’t map a single outside-review note back to the corresponding editor element, so we can’t run the cross-test as described.