PLUS | Release Notes | 日本語

HTML & Markdown Preview / AI-Agent Voice Preview

Key Feature 1. HTML/Markdown Preview
Reflect code changes serverless & in real time to boost development efficiency.

HTML Speed Viewer instantly previews HTML/Markdown in VS Code and synchronizes selection highlighting between the editor and the preview. It also renders PHP files that contain inline/encoded HTML (e.g., HTML templates) as HTML.

Key Feature 2. Voice Preview
Reduce eye strain while coding. Text-to-speech enables a more comfortable development experience.

Includes VoicePreview (MCP-compatible text-to-speech). Beyond playing text aloud, when paired with Cursor / GitHub Copilot / Claude CLI, you can listen to agent-chat completion notifications, key points, and next actions, letting you stay immersed without breaking your flow and reducing cognitive load during development.

🎉 Try Voice Preview for free >>

Features

• Lightweight & Simple

  No web server required. Everything runs within VSCode, making setup quick and easy.

• Supports Various Formats

  Supports multiple file types such as HTML, PHP (extracting the HTML part for display), and Markdown. Compatible with extensions like .html, .htm, .php, .xhtml, .shtml, .xht, .ehtml, .md, and more.

• Real-Time Preview

  Whenever you edit the file in the editor, the preview updates immediately.

• Bidirectional Element Sync:

  • Select an HTML element in the code → That element is highlighted in the preview
  • Click an element in the preview → The corresponding part in the code editor is selected

• Disable Links & Grid Display

  Easily toggle link-click disablement or grid display using the sidebar menu or command palette.

• Multi-Preview Functionality ( Plus )

  • You can launch multiple previews simultaneously.

• Voice playback: English / Japanese （ Plus )

• MCP-ready

  • control voice playback from agents such as Cursor / GitHub Copilot / Codex CLI / Claude CLI（ Plus )

1.HTML/Markdown Preview

Open a supported file and run the command to show a live preview in VS Code. You get code↔preview cross-highlighting, link disable/enable, and a grid overlay for layout checks. Multi-Preview (Plus) lets you open multiple preview windows for parallel comparison.

• Instant preview for supported extensions (HTML / PHP / Markdown, etc.)
• Cross-highlighting / link disable / grid toggle
• Multi-Preview (Plus) — open multiple previews to compare side-by-side

Supported file types & behavior

2.Voice Preview

🎉 Try Voice Preview for free

Automatically reads aloud the completion summary, digest, and next actions from your agent, or the text currently in the preview. It helps reduce visual strain during long sessions and boosts productivity when coding with AI assistance. With MCP support, you can combine prompts and link with AI agents for an even more comfortable development experience.

Features

• No local server required — start voice preview instantly
• Accessibility-friendly — ideal for developers who prefer auditory feedback
• Hands-free voice reviewing — review content while coding or multitasking
• English and Japanese supported
• MCP support — control playback via AI agents; works with Cursor, Codex CLI, Claude CLI, GitHub Copilot, and others

Quick Start

1. HTML Preview — Open a supported file → run HTML Speed Viewer → edits are reflected instantly (clicking elements also highlights the corresponding code)
2. Multi-Preview (Plus) — Sign in and confirm your plan → run HTML Speed Viewer: Open Another Viewer
3. Voice Preview (Plus) — In the preview, open Voice Preview → follow MCP setup (see Docs) → trigger playback from Cursor / Codex CLI, etc.

Commands

Run from the Command Palette (Ctrl+Shift+P / Cmd+Shift+P). Commands are grouped into Basics and Settings / Actions.

Basic Functions

Settings/Operation Functions

MCP Setup

For detailed MCP setup and usage instructions, please refer to our documentation.

License

This extension is provided under the following terms:

• Scope of Use: Available as a Visual Studio Code extension.
• Redistribution: Please install from the Visual Studio Marketplace. Redistribution is not permitted.
• Modification: Modifying the source code is not allowed.
• Commercial Use: Commercial use is permitted.

We Value Your Feedback!

Thank you for trying out our extension. Your input helps us improve!

• Questions or suggestions? Drop us a note in our Feedback Form. We appreciate your support and look forward to making this tool better for you.

HTML Speed Viewer - Feedback

Thank you for using HTML Speed Viewer!