CSV to HTML Table Converter

Publishing a table on a website, in a CMS or in an email means writing a lot of repetitive markup. Paste CSV — or cells copied from a spreadsheet — and get a well-structured <table> with a proper header, escaped content and right-aligned numeric columns, ready to paste into WordPress, a static site or a newsletter.

1. Paste CSV or spreadsheet cells, or upload a file.
2. The HTML table is generated instantly with <thead> and <tbody> sections.
3. Copy the markup into your page's HTML editor (in WordPress, use a Custom HTML block).
4. Style it with your site's CSS, or use the starter styles below.

Example

Product,Price,In stock
Notebook A5,4.50,yes
"Pen <gel>, blue",1.20,no

<table>
  <thead>
    <tr>
      <th>Product</th>
      <th style="text-align:right">Price</th>
      <th>In stock</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>Notebook A5</td>
      <td style="text-align:right">4.5</td>
      <td>yes</td>
    </tr>
    <tr>
      <td>Pen &lt;gel&gt;, blue</td>
      <td style="text-align:right">1.2</td>
      <td>no</td>
    </tr>
  </tbody>
</table>

The < and > characters in the product name are escaped so they display as text instead of being interpreted as HTML, and the numeric Price column is right-aligned.

The generated markup

• Semantic structure: <table>, <thead> with <th> header cells, and <tbody> rows.
• All text is HTML-escaped, which also prevents script injection from untrusted data.
• Columns containing only numbers get style="text-align:right" so figures line up.
• Line breaks in cells become <br>.
• No classes or frameworks, so the table inherits your site's existing styles.

Styling the table

A few lines of CSS make the plain table readable — borders, padding and alternating row colours. Add the snippet from the code section to your stylesheet, or put it in a <style> element on the page.

Tables in emails and accessibility

Email clients ignore most external CSS, so keep tables simple and inline any styles you need. For screen readers, the header cells already identify each column; adding a <caption> that describes the table helps even more.

Convert CSV to HTML in code

For one-off files the tool above is quickest. To automate the same task in a script or pipeline, these snippets are a good starting point.

Starter CSS

table { border-collapse: collapse; width: 100%; font-size: 14px; }
th, td { border: 1px solid #e2e8f0; padding: 8px 12px; text-align: left; }
thead th { background: #f1f5f9; font-weight: 600; }
tbody tr:nth-child(even) { background: #f8fafc; }

Python (pandas)

import pandas as pd

df = pd.read_csv("products.csv")
html = df.to_html(index=False, border=0, escape=True)

Frequently asked questions

Related converters