HTML Table Generator

⭐ HTML Table Generator – Explanation & Examples

The HTML Table Generator turns spreadsheet data into a ready-to-use HTML table. Import an Excel or CSV file (or start with an empty table), edit the cells in a visual table editor, check the live preview and copy the clean HTML into your website, blog, newsletter or CMS. You do not need to know anything about HTML: the generator writes the <table>, <thead>, <tbody>, <th> and <td> tags for you.

The whole workflow is: Import Excel/CSV → check or edit the table → preview → Copy HTML.

🔎 What does the HTML table generator do?

• Creates a new HTML table from scratch – choose the number of rows and columns and type your content.
• Converts Excel to an HTML table – import .xlsx or .xls files, pick a worksheet and the data appears in the editor.
• Converts CSV to an HTML table – import comma, semicolon, tab or pipe separated files; the separator and text encoding are detected automatically.
• Lets you edit every cell – add or delete rows and columns, move columns, clear contents and set the first row as header.
• Shows a live preview that looks like a real HTML table, not a spreadsheet.
• Generates clean, semantic HTML with proper indentation and escaped special characters.

⚙️ How to convert Excel or CSV to an HTML table

1. Drop your Excel or CSV file on Drop an Excel or CSV file here, or click Import Excel, Import CSV or Choose file.
2. If the Excel workbook contains several worksheets, pick the sheet you want in the Worksheet list.
3. For CSV files, check the detected separator and encoding. If a column looks wrong, choose a different Separator (comma, semicolon, tab or pipe).
4. Review the data in the Table editor. Click any cell to change its text, use Add row, Add column or the × buttons to remove rows and columns, and use ◀ ▶ to move a column.
5. Leave First row is header switched on if the first row contains column titles.
6. Adjust the Table options: border, responsive table, width, cell padding, text alignment and caption.
7. Check the Live preview and click Copy HTML or Download HTML.

💡 Example 1: a simple table with a header row

Data in the editor:

Product        | Price | In stock
Wireless mouse | 24.95 | Yes
USB-C hub      | 39.00 | Yes

Generated HTML (styling switched off):

<table>
  <thead>
    <tr>
      <th scope="col">Product</th>
      <th scope="col">Price</th>
      <th scope="col">In stock</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>Wireless mouse</td>
      <td>24.95</td>
      <td>Yes</td>
    </tr>
    <tr>
      <td>USB-C hub</td>
      <td>39.00</td>
      <td>Yes</td>
    </tr>
  </tbody>
</table>

The first row becomes a <thead> with <th scope="col"> cells; all other rows go into the <tbody>. This is the structure search engines, screen readers and CSS frameworks expect.

💡 Example 2: border, width and responsive wrapper

With Add border, Responsive table and Table width: 100% switched on, the generator adds a small <style> block and a scrolling wrapper. Everything is plain HTML and CSS – no JavaScript.

<style>
  .data-table { border-collapse: collapse; width: 100%; }
  .data-table th, .data-table td { border: 1px solid #cccccc; padding: 8px; text-align: left; }
  .data-table th { background-color: #f2f2f2; font-weight: bold; }
  .table-wrapper { overflow-x: auto; }
</style>

<div class="table-wrapper">
  <table class="data-table">
    ...
  </table>
</div>

On a phone or a narrow column the table can scroll sideways instead of breaking the page layout. If your website already styles tables, switch Include styling off and paste only the bare table.

💡 Example 3: special characters are escaped automatically

Spreadsheets often contain characters that have a special meaning in HTML. A cell with the text

Price < 50 & "in stock"

is written to the HTML as

<td>Price &lt; 50 &amp; &quot;in stock&quot;</td>

so the browser shows exactly what was in the cell instead of interpreting it as a tag. Line breaks inside a cell are converted to <br>, and empty cells become empty <td></td> elements so the columns stay aligned.

💡 Example 4: a Dutch or European CSV with semicolons

Excel in many European countries saves CSV files with a semicolon as separator:

Naam;Plaats;Bedrag
Jansen;Amsterdam;12,50
De Vries;Utrecht;8,75

The CSV importer detects the semicolon automatically and shows Detected separator: Semicolon. Values such as 12,50 stay exactly as they are. If the detection ever picks the wrong character, select the right separator and the table is rebuilt immediately.

⚙️ Table editor features

• Edit cells – click a cell and type. Enter moves to the cell below (and adds a new row at the bottom), Tab moves to the right.
• Paste from Excel or Google Sheets – copy a block of cells in your spreadsheet and paste it into a cell; the block fills the table from that cell onwards.
• Add row / Add column – appends a new empty row or column.
• Delete row / Delete column – use the × button next to a row number or column letter.
• Move column – use ◀ and ▶ in the column header to reorder columns.
• Clear contents – empties every cell but keeps the rows and columns.
• First row is header – marks the first row as <th> cells inside <thead>.

⚙️ Table options explained

• Add border – draws a thin grey line around every cell.
• Responsive table – wraps the table in a container that scrolls horizontally on small screens.
• Include styling – adds a compact <style> block with the border, padding, alignment and width settings. Switch it off for pure HTML without any CSS.
• Table width – Auto (as wide as the content), 100% (full width of its container) or a custom value such as 600px or 80%.
• Cell padding – space inside each cell in pixels.
• Text alignment – left, center or right for all cells.
• Caption – an optional title that is added as a <caption> element above the table.

⭐ When do you need an HTML table generator?

• Publishing a price list, schedule or product comparison from Excel on your website
• Adding a data table to a WordPress, Joomla, Drupal or Shopify page without a table plugin
• Converting a CSV export from a shop, CRM or database into a table for a report or intranet page
• Building tables for HTML newsletters and email templates
• Creating documentation, knowledge-base articles or Markdown/HTML wiki pages with tabular data
• Quickly prototyping a table layout before styling it with your own CSS

⚠️ Things to keep in mind

• All processing happens in your browser. Excel and CSV files are never uploaded to a server.
• Merged cells, colours, fonts and formulas from Excel are not carried over – only the displayed cell values are imported.
• Excel dates and numbers are imported as they are displayed in Excel (the formatted text), not as raw values.
• Very large files: the editor shows 100 rows per page and the preview shows the first 200 rows, but the generated HTML always contains every row. To keep your browser responsive, imports are limited to 200,000 cells.
• The generated code contains no JavaScript, so it does not include click-to-sort behaviour. Add your own script or a table plugin if you need sortable columns.

🔎 Try the tool

Drop an Excel or CSV file, check the table, and copy the HTML – or click Load example to see how a finished table looks. No sign-up, no upload, no HTML knowledge required.

This tool is also known as

• html table generator online
• excel to html table converter
• csv to html table generator
• create html table from spreadsheet
• html table code generator with preview