Developer Tools

HTML Viewer

View, inspect, and format HTML code with escaped source output, text representations, character counts, and line segment analysis.

Run tool

This online HTML Viewer lets you inspect markup structure, view escaped entity representations, and examine segment metrics directly from your browser. Paste any HTML snippet into the input area and select your preferred viewing format. In source mode, the tool returns the escaped version of your markup, converting special characters into safe entity text suitable for embedding or code review. Switching to preview mode returns both the raw markup text and its escaped counterpart side by side. For any non-empty input in either format, the tool calculates total character length and counts newline-separated lines to assist with markup sizing and formatting checks. If you submit an empty field, the tool provides a clean empty output without errors. Whether you need to prepare code blocks for documentation, verify entity replacements, or inspect raw HTML text layouts, this utility gives you instant text-level insights without executing scripts or altering underlying markup structure.

Instructions

  1. Paste or type your markup into the HTML Input text box.
  2. Select your desired viewing format: choose source to get escaped code or preview to receive both raw and escaped representations.
  3. Submit your input to generate the text output.
  4. Review the resulting escaped markup alongside character counts and line segment metrics in the result panel.

Examples

  • Input: <article class="post"><h1>Hello</h1><p>Welcome!</p></article> with Mode set to source -> The output displays the escaped markup &lt;article class=&quot;post&quot;&gt;&lt;h1&gt;Hello&lt;/h1&gt;&lt;p&gt;Welcome!&lt;/p&gt;&lt;/article&gt; along with a character count of 63 and a line segment count of 1.
  • Input: <ul> <li>Item 1</li> <li>Item 2</li> </ul> with Mode set to preview -> The output returns both the supplied HTML text and the escaped markup, reporting 43 characters across 4 line segments.

FAQ

Does preview mode render active HTML or run scripts?

No. Preview mode returns text representations of the supplied HTML and escaped HTML. It does not execute JavaScript, sanitize code, or render interactive web pages.

What happens if I leave the HTML input empty?

If the input is empty, the tool returns an empty content response without raising an error.

What is the difference between source and preview modes?

Source mode returns the escaped text representation of your markup, while preview mode returns both the supplied HTML text representation and the escaped version.

What counts are reported with each request?

For non-empty input, the response includes the total number of characters and the total number of newline-separated line segments in your HTML markup.

Embed this tool

Add this working SmartPlusLab tool to your website with the code below.