Build clean, semantic HTML table markup from an editable grid with header, caption, border, and stripe options — every cell escaped and a live preview.
Updated
| Header 1 | Header 2 | Header 3 |
|---|---|---|
| Cell 2,1 | Cell 2,2 | Cell 2,3 |
| Cell 3,1 | Cell 3,2 | Cell 3,3 |
Quick start
Set the grid size, edit the cells, copy semantic table markup — all in your browser.
Choose the number of rows and columns and toggle the header, border, and stripe options.
Type content into each cell; the preview and HTML update live.
Copy the clean, escaped HTML table and paste it into your page.
In-depth guide
HTML tables remain the correct way to present two-dimensional, tabular data — schedules, pricing grids, comparison charts. Hand-writing the nested <table>, <tr> and <td> tags is tedious and error-prone. This generator builds well-indented, semantic markup from a grid you edit in the browser, escaping every value so the output is safe to paste anywhere.
Use a <table> only for genuinely tabular data — rows and columns that have meaning together, like a price list or a timetable. Tables are the semantically correct, accessible choice there.
<thead> with <th> cells.<th> cells is far harder for assistive technology to navigate. Keep the header option on unless the data truly has no headings.style attributes, so your stylesheet stays in control. Define .table-bordered and .table-striped in your CSS, or rely on a framework that already does.< and & can break the markup. Here every value is escaped automatically.The table markup and its live preview are generated entirely in your browser from the cells you type. No table data is uploaded, logged, or sent to any server — you can confirm this in your browser's Network panel, where no requests appear while you build the table.
No. The markup is built in your browser from the cells you type, and the live preview renders that same string locally. Nothing is sent to a server — verify in DevTools → Network that no requests fire.
Yes. Every cell, header, and caption value is HTML-escaped before it goes into the markup, so characters like <, >, & and quotes become entities and cannot inject scripts or break your layout. The output is clean, semantic <table>/<thead>/<tbody> markup.
When enabled, the first row is emitted inside <thead> using <th> cells instead of <td>, which is the correct semantic structure for a table with column headings. Screen readers and browsers use <th> to associate data cells with their headers.
They add class="table-bordered" and/or "table-striped" to the <table> element so you can style it with your own CSS or a framework like Bootstrap. The generator does not inline any styles, keeping the markup framework-agnostic; the on-page preview applies its own styling just for display.
Yes. The grid under the options is fully editable — click any cell and type. Header cells are highlighted when the header option is on. Adjust the row and column counts to resize the grid while keeping the content you have already entered.
The editor supports up to 12 rows and 12 columns, which covers most hand-built tables. For larger datasets you would normally generate the markup programmatically from your data source rather than typing each cell.
Keep exploring
Hand-picked utilities that pair well with the one you're on — all free, client-side, and zero-signup.
Create QR codes for URLs, text, vCards, email, and Wi-Fi credentials with live preview, error-correction settings, and instant PNG/SVG download.
Strong random passwords with length and charset controls.
Generate random integers, floats or sequences in a range.
Shrink PDF file size without uploading to a server.
Body Mass Index with metric / imperial inputs and WHO category bands.
Combine multiple PDFs into one in your browser.
Split a PDF by pages or page ranges, download as zip.