How to use it
- Type the cells in the grid, or paste CSV or TSV under Paste CSV or TSV and press Load into the table.
- Tick The first row is a header and The first column is a header to mark the header cells.
- Type a Caption that says what the table shows. Tick Add a minimal style if the table needs borders.
- Copy the HTML box or press Download, and paste the markup into your page.
Why header cells have a scope
A header cell is a th element, not a td. Its scope attribute says which cells it labels: col for a header above a column, and row for a header at the start of a row. Screen readers announce those headers with each data cell, so a visitor who cannot see the grid still knows what a number means.
The caption is the title of the whole table, and it is the first thing inside the table. Write a caption that says what the table shows, such as Monthly sales, rather than leaving it out. The HTML tables section describes these elements.
header above a column: th with scope col; header at the start of a row: th with scope row; data: tdPasting from a spreadsheet and the escaping
CSV text separates cells with commas, semicolons or tabs, and a cell that holds one of those characters is wrapped in double quotation marks. Copying cells from a spreadsheet usually gives tab-separated text. Spreadsheets in languages that write the decimal part with a comma often save CSV files with semicolons. Detect reads the first line and chooses the separator that occurs most often.
Every cell's text is escaped before it is written. A character such as the less-than sign or the ampersand becomes a character reference, so it shows as text on the page and is never read as markup. A short row is filled with empty cells, so every row has the same number of cells.
Worked example: a two-column table with a header row and a header column
Take the cells Month and Sales in the first row and Jan and 1200 in the second, with the first row and the first column as headers and the caption Sales.
The table begins with a caption element that reads Sales, then a head with two header cells, each with the scope col, followed by a body in which Jan is a header cell with the scope row and 1200 is a data cell.
Frequently asked questions
What does the scope attribute do?
It tells assistive technology which cells a header labels. A scope of col means the header sits above its column, and a scope of row means it sits at the start of its row. Without a scope, a screen reader has to guess the relation.
When should I use the header column?
Use it when the first column names each row, such as a product, a person or a month. A table of numbers with no row names does not need one, so leave it off.
Why does the table need a caption?
A caption gives the table a title that screen readers announce before the cells. It also helps a sighted visitor see what the table is about at a glance, so write one whenever the table stands on its own.
Which separator should I choose for a spreadsheet?
Choose Tab for text copied from a spreadsheet, and Semicolon for a CSV file saved in a language that uses a comma as the decimal mark. Detect works in most cases, and the preview shows the result before you copy it.
Does the minimal style change other tables on my page?
Yes, if you paste it into the page as it is, because the style element applies to every table on the page. Leave it out when your page already styles its tables, or copy only the rules you need.
Is the table I type or paste sent or saved anywhere?
No. The table, the preview and the HTML are made in your browser. Nothing is stored or sent to our server, so copy the HTML or download it before you leave the page.
Sources
Figures and text last checked on Tuesday, November 10, 2026.