Table mode finds all elements in the HTML and converts each one to a JSON array. Each becomes an object, with keys taken from the first row if "First Row as Header" is enabled, or from Col 1, Col 2… if not.

List mode finds all and elements and converts each to a JSON array. Nested lists produce nested arrays. Each becomes either a string (plain text) or an object with text and children (if nested).

HTML to JSON Converter

Paste HTML and extract clean JSON in one click. Convert tables to arrays of objects, lists to arrays, or any HTML to a DOM tree — without writing a parser.

Last updated: May 20, 2026

Indent:

First row as header

HTML Input

JSON Output

[
  {
    "Plan": "Starter",
    "Price": "$9/mo",
    "Users": "5",
    "Storage": "10 GB"
  },
  {
    "Plan": "Pro",
    "Price": "$29/mo",
    "Users": "25",
    "Storage": "100 GB"
  },
  {
    "Plan": "Enterprise",
    "Price": "Custom",
    "Users": "Unlimited",
    "Storage": "1 TB"
  }
]

1 table found

Client-Side Processing

Input Data Stays on Device

Instant Local Execution

Find this tool useful? Support the project to keep it free!

Buy me a coffee

What is HTML to JSON Converter?

HTML tables are one of the most common ways structured data appears on the web — pricing pages, comparison tables, sports stats, financial data, and directory listings all use HTML tables. Extracting that data usually means writing a custom scraper or parser.

This tool does it for you: paste the HTML containing a table, list, or any structure, pick a conversion mode, and get clean JSON ready to use in your code. Table mode turns each row into an object keyed by the header row. List mode converts `<ul>` and `<ol>` elements into JSON arrays, including nested lists. Tree mode converts any HTML fragment into a JSON representation of the DOM structure.

How to Use HTML to JSON Converter

Paste HTML into the input area or click a sample button

Choose a mode: Table (for <table> elements), List (for <ul>/<ol>), or Tree (full DOM)

Set indent size and toggle options like First Row as Header

The JSON output updates instantly

Copy the JSON or download it as a .json file

Common Use Cases

Developers extracting data from HTML tables copied from Wikipedia, financial sites, or sports statistics pages.
Data analysts scraping product comparison tables or pricing grids for import into spreadsheets or databases.
Back-end engineers converting CMS HTML output into structured JSON for API responses.
QA testers verifying that an HTML table renders the expected data by comparing it against a JSON fixture.
Students extracting tabular data from web pages for data science or machine learning exercises.
Automation engineers parsing HTML email content or report exports into structured JSON for processing.

Example Input and Output

An HTML pricing table is converted to a JSON array of objects, one per row, keyed by the header row.

HTML input

<table>
  <tr><th>Plan</th><th>Price</th><th>Users</th></tr>
  <tr><td>Starter</td><td>$9/mo</td><td>5</td></tr>
  <tr><td>Pro</td><td>$29/mo</td><td>25</td></tr>
  <tr><td>Enterprise</td><td>Custom</td><td>Unlimited</td></tr>
</table>

JSON output (Table mode)

[
  { "Plan": "Starter", "Price": "$9/mo", "Users": "5" },
  { "Plan": "Pro", "Price": "$29/mo", "Users": "25" },
  { "Plan": "Enterprise", "Price": "Custom", "Users": "Unlimited" }
]

Privacy

All HTML parsing and JSON generation runs in your browser. No data is uploaded to any server.

Multiple tables

If the HTML contains multiple tables, the output is a JSON array where each element is the data for one table. Single-table HTML produces a flat array of row objects.

Frequently Asked Questions

What is Table mode?

Table mode finds all <table> elements in the HTML and converts each one to a JSON array. Each <tr> becomes an object, with keys taken from the first row if "First Row as Header" is enabled, or from Col 1, Col 2… if not.

What is List mode?

List mode finds all <ul> and <ol> elements and converts each to a JSON array. Nested lists produce nested arrays. Each <li> becomes either a string (plain text) or an object with text and children (if nested).

What is Tree mode?

Tree mode converts the HTML fragment into a JSON representation of the DOM — each element becomes an object with tag, optional attrs, and children. Useful for programmatic analysis of HTML structure.

Can I extract data from a full HTML page?

Yes. Paste the full page HTML and the tool will find the tables or lists inside it. For table and list modes, only the relevant elements are extracted.

What if my table has merged cells (colspan/rowspan)?

Merged cells are currently read as a single value in the cell position they appear. Complex colspan/rowspan layouts may need manual cleanup after extraction.

Is my HTML sent to a server?

No. All parsing and conversion runs in your browser. Your HTML never leaves your device.

Related Tools

CSV to JSON Converter

Convert CSV files to JSON arrays instantly — with header mapping, delimiter options, and type inference.

XML to JSON Converter

Parse and convert XML to clean JSON instantly — attributes, namespaces, and nested elements handled.

YAML to JSON Converter

Convert YAML to JSON and JSON to YAML — for config files, CI pipelines, and Kubernetes manifests.

JSON Formatter

Format, validate, and beautify JSON instantly — with clear error messages, Tree View, Diff mode, and Schema validation.

HTML Stripper

Remove HTML tags from text, preserving line breaks and decoding HTML entities. Instant plain-text extraction from HTML.

HTML to JSX Converter

Convert HTML to JSX for React — converts class to className, for to htmlFor, self-closes void elements, and converts inline styles to JSX objects.