Preparing your generator page
We are loading content and tools so everything is ready to use.
We are loading content and tools so everything is ready to use.
Write a <table> fragment with an optional header row, inline text-align, and a class. The page opens at 4 empty body rows and 3 columns named Column 1, Column 2, and Column 3, all aligned left, with the class table table-bordered. The output box is the HTML source. It updates as you type, and cell text is escaped so & and < stay text.
A Markdown version is the Markdown table generator. More helpers are in Utility tools.
Last updated: October 8, 2026 · Published: 2026-04-09 · Updated: 2026-10-08
Headers and alignment
Table data
HTML output
Generated markup is compatible with plain HTML pages and can be styled via CSS frameworks or custom classes.
It fills in the tags for one table. The header, when included, is a single <tr> of <th> cells inside <thead>. Each body row is a <tr> of <td> cells inside <tbody>. Body rows are the number in the Body rows field. The header is an extra row.
Alignment is an inline style on every cell in the column. The class on the table is whatever you type. The starting value, table table-bordered, is Bootstrap’s class pair for a bordered table. This generator does not attach a stylesheet, so those class names change the look only on a page that already defines them. The text-align styles work without that stylesheet.
Copy takes the fragment only. There is no doctype and no <html> wrapper. Nothing is uploaded.
Four steps. The source follows each edit.
Body rows start at 4 and stop at 30. Columns start at 3 and stop at 10.
Edit each header and set Left, Center, or Right. Uncheck Include thead to leave the header row out of the HTML.
Type body text. The source updates immediately, and characters that would break markup are escaped.
Copy HTML table copies the <table> block. Paste it into a page that already has the CSS you want.
The markup rules for every edit.
| Setting | This generator |
|---|---|
| Output | A <table> fragment |
| Default size | 4 body rows, 3 columns, plus a header row |
| Limits | 1–30 body rows, 1–10 columns |
| Header cells | <th> inside <thead>, one row |
| Body cells | <td> inside <tbody> |
| Alignment | style="text-align:left|center|right;" |
| Default class | table table-bordered |
| Stylesheet | None included |
| Escaping | & < > " and ' |
| Update | Live, as you type |
Size, class, header, and alignment all rewrite the same fragment.
1 to 30 <tr> elements inside <tbody>. The header row is extra.
1 to 10. A new column is named Column N and aligned left.
Optional class attribute. Default is table table-bordered. Blank removes the attribute.
On by default. Off, and the <th> row is omitted. Alignment still styles each <td>.
Inline text-align on every cell in that column: left, center, or right.
The source in the box. The box is the markup, not a painted preview.
The source in the box when the page opens, before any cell is filled in.
<table class="table table-bordered">
<thead>
<tr><th style="text-align:left;">Column 1</th><th style="text-align:left;">Column 2</th><th style="text-align:left;">Column 3</th></tr>
</thead>
<tbody>
<tr><td style="text-align:left;"></td><td style="text-align:left;"></td><td style="text-align:left;"></td></tr>
<tr><td style="text-align:left;"></td><td style="text-align:left;"></td><td style="text-align:left;"></td></tr>
<tr><td style="text-align:left;"></td><td style="text-align:left;"></td><td style="text-align:left;"></td></tr>
<tr><td style="text-align:left;"></td><td style="text-align:left;"></td><td style="text-align:left;"></td></tr>
</tbody>
</table>What you type, and what the tag contains.
| Typed | In the HTML |
|---|---|
| Tom & Jerry | Tom & Jerry |
| <b> | <b> |
| Say "hi" | Say "hi" |
| it's | it's |
Features this fragment does not include.
| Feature | This generator |
|---|---|
| <caption> | Not written |
| <tfoot> | Not written |
| colspan and rowspan | Not written |
| scope on <th> | Not written |
| align attribute | Not used; alignment is CSS text-align |
| in empty cells | Empty cells stay empty |
| Full HTML document | No doctype, html, or body wrapper |
| CSV or Markdown import | Cells are typed in the grid |
Short definitions for the words on this page.
The header section. This generator puts one <tr> of <th> cells in it when the checkbox is on.
The body section. Every body row is a <tr> of <td> cells. It is always present.
The inline CSS that sets Left, Center, or Right for a whole column.
The table element alone. Paste it inside a page you already have.
Names on the <table> tag for CSS you supply. The default names match Bootstrap and do nothing here by themselves.
Default markup, alignment, the class attribute, escaping, and the tags this fragment does not write.
Explore more tools in the directory.