WYSIWYG HTML Editor — nimcity labs

Edit HTML visually, right inside VS Code. A full design view with real-time bidirectional sync and a clean dark UI that feels native to VS Code.

Features

Visual Design View

Open any HTML file and get a full visual editor in a side panel — white canvas, element breadcrumb in the status bar. Edit by clicking and typing, just like a desktop HTML editor.

Real-Time Bidirectional Sync

Every change in the visual editor instantly updates your source code, and every change in code instantly updates the visual view. Debounce delay is configurable.

Full HTML Document Support

Works with complete documents (<!DOCTYPE>, <head>, <body>). Stylesheets from <head> are applied in the canvas so your page renders exactly as intended.

Print to PDF

One click opens your HTML in the browser with the print dialog pre-triggered. Save as PDF from any browser.

Local Asset Resolution

Relative image and CSS paths are resolved to your document's directory so everything renders correctly in the canvas.

Getting Started

Open any .html file in VS Code
Click the preview icon (eye) in the editor title bar — or run WYSIWYG: Open Editor from the Command Palette (Ctrl+Shift+P)
The visual editor opens beside your code

Group	Tools
History	Undo, Redo
Format	Paragraph styles, Font family, Font size
Text	Bold, Italic, Underline, Strikethrough
Alignment	Left, Center, Right, Justify
Lists	Bullets, Numbers, Indent, Outdent
Insert	Link, Image, Media, Table, Special characters
Color	Text color, Highlight color
Utilities	Clear formatting, Source code, Fullscreen
Export	Print to PDF

Settings

Setting	Default	Description
`wysiwygHtml.syncDelay`	`300`	Debounce delay in ms between edits and sync (100–2000)

Requirements

VS Code 1.85.0 or later.

License

GPL-2.0 — required by TinyMCE, which powers the editor.

Built by nimcity labs

WYSIWYG HTML Editor — nimcity labs

nimcitylabs

WYSIWYG HTML Editor — nimcity labs

Features

Visual Design View

Real-Time Bidirectional Sync

Full HTML Document Support

Print to PDF

Local Asset Resolution

Getting Started

Toolbar Reference

Settings

Requirements

License