Skip to content
| Marketplace
Sign in
Visual Studio Code>Other>Better Email Design SystemsNew to Visual Studio Code? Get it now.
Better Email Design Systems

Better Email Design Systems

Better Email

| (0) | Free
Live preview for Better Email Design Systems as Code — starts better ds dev and opens the app-hosted preview.
Installation
Launch VS Code Quick Open (Ctrl+P), paste the following command, and press enter.
Copied to clipboard
More Info

Better Email Design Systems (VS Code)

Live preview for Design Systems as Code. Thin client over the CLI: the extension starts better ds dev in your workspace and opens the app-hosted preview (module switcher, real settings sidebar, hot reload).

Features

  • Start and stop a live, app-hosted preview from VS Code.
  • Get schema-powered autocomplete, hover documentation, and validation for design-system.json, Module settings.json and module.json files. The Template Base root settings.json uses its explicit $schema declaration.

Requirements

  • @better-email/cli installed (npm install -g @better-email/cli) and logged in (better login)
  • A pulled Design System folder (contains design-system.json)

Settings

  • betterEmail.cliPath — path to the better binary from @better-email/cli. Defaults to better.

Commands

  • Better Email: Start Local Preview — starts the dev server, opens the preview in your browser; status-bar item while running
  • Better Email: Stop Local Preview

Package for installation with npx @vscode/vsce package in this directory.

  • Contact us
  • Jobs
  • Privacy
  • Manage cookies
  • Terms of use
  • Trademarks
© 2026 Microsoft