JSON to Table Converter
Convert a JSON array of objects into a semantic HTML table.
Written by Golam Rabbani, Founder & Lead Engineer
How to use this json to table converter
- Paste a JSON array of objects into the input textarea.
- Optionally set a CSS class to apply to the generated <table> element.
- Click Generate table to convert the JSON into HTML table markup.
- Click Copy HTML to grab the result, or Reset to clear and start over.
About this json to table converter
The JSON to table converter takes a JSON array of objects and emits a semantic HTML <table> with one column per unique key and one row per array element. It is the fastest way to turn API responses, exported datasets, or hand-written JSON snippets into a tabular view you can drop into a static page, an email, or a CMS that does not parse JSON.
The converter scans every object in the input array and unions their keys to build the column list, so missing keys in some rows simply produce empty cells rather than skipping the row entirely. Nested objects and arrays are stringified back to JSON for the cell value, since HTML tables are inherently 2-D. All cell content is HTML-escaped to prevent any HTML or script in the data from breaking the surrounding markup. The output uses <thead> for the column headers and <tbody> for data rows, the structure expected by screen readers and standard table CSS.
For example, the input [{"name":"Ada","role":"Admin"},{"name":"Grace","role":"Editor"}] generates a two-row table with name and role columns. Everything runs in your browser; your JSON is never uploaded.
FAQ
- What input format does this expect?
- A JSON array where every element is an object (not a primitive or nested array). The keys of those objects become the table columns.
- What happens to nested objects or arrays inside a cell?
- They are JSON-stringified back to text and placed in the cell. HTML tables are 2-D so deeper nesting cannot be rendered structurally; if you need a fully nested view, use the JSON to HTML tool instead.
- What if my objects have different keys?
- The converter unions every key across every row and emits one column per unique key. Rows that lack a particular key get an empty cell in that column.
- Is the output safe to paste anywhere?
- Yes — cell content is HTML-escaped (& < > are replaced with entities), so any HTML or script-like text in your JSON renders literally instead of being interpreted as markup.
- How do I style the result?
- Set a class name in the "CSS class" field and target it with your own CSS. The output uses standard <thead>, <tbody>, <th>, and <td>, so any existing table styles will apply.
- Does this work with very large arrays?
- The conversion runs in your browser and scales linearly. Tens of thousands of rows still work, though the resulting HTML can become very large. For huge datasets, consider paginating or filtering the JSON first.