Clean Html Table Code Online

HTML TABLE code beauty tool helps you to beautify code, remove attributes and inline styles in table, tr, td, th tags.

Input Table Html
Example
<div class="flex flex-col"> <div class="overflow-x-auto sm:-mx-6 lg:-mx-8"> <div class="py-2 inline-block min-w-full sm:px-6 lg:px-8"> <div class="overflow-hidden"> <table class="min-w-full text-center"> <thead class="border-b"> <tr> <th scope="col" class="text-sm font-medium text-gray-900 px-6 py-4"> Class </th> <th scope="col" class="text-sm font-medium text-gray-900 px-6 py-4"> Heading </th> <th scope="col" class="text-sm font-medium text-gray-900 px-6 py-4"> Heading </th> </tr> </thead> <tbody> <tr class="border-b"> <td class="text-sm text-gray-900 font-medium px-6 py-4 whitespace-nowrap"> Default </td> <td class="text-sm text-gray-900 font-light px-6 py-4 whitespace-nowrap"> Cell </td> <td class="text-sm text-gray-900 font-light px-6 py-4 whitespace-nowrap"> Cell </td> </tr> <tr class="border-b bg-blue-100 border-blue-200"> <td class="text-sm text-gray-900 font-medium px-6 py-4 whitespace-nowrap"> Primary </td> <td class="text-sm text-gray-900 font-light px-6 py-4 whitespace-nowrap"> Cell </td> <td class="text-sm text-gray-900 font-light px-6 py-4 whitespace-nowrap"> Cell </td> </tr> <tr class="border-b bg-purple-100 border-purple-200"> <td class="text-sm text-gray-900 font-medium px-6 py-4 whitespace-nowrap"> Secondary </td> <td class="text-sm text-gray-900 font-light px-6 py-4 whitespace-nowrap"> Cell </td> <td class="text-sm text-gray-900 font-light px-6 py-4 whitespace-nowrap"> Cell </td> </tr> <tr class="border-b bg-green-100 border-green-200"> <td class="text-sm text-gray-900 font-medium px-6 py-4 whitespace-nowrap"> Success </td> <td class="text-sm text-gray-900 font-light px-6 py-4 whitespace-nowrap"> Cell </td> <td class="text-sm text-gray-900 font-light px-6 py-4 whitespace-nowrap"> Cell </td> </tr> <tr class="border-b bg-red-100 border-red-200"> <td class="text-sm text-gray-900 font-medium px-6 py-4 whitespace-nowrap"> Danger </td> <td class="text-sm text-gray-900 font-light px-6 py-4 whitespace-nowrap"> Cell </td> <td class="text-sm text-gray-900 font-light px-6 py-4 whitespace-nowrap"> Cell </td> </tr> <tr class="border-b bg-yellow-100 border-yellow-200"> <td class="text-sm text-gray-900 font-medium px-6 py-4 whitespace-nowrap"> Warning </td> <td class="text-sm text-gray-900 font-light px-6 py-4 whitespace-nowrap"> Cell </td> <td class="text-sm text-gray-900 font-light px-6 py-4 whitespace-nowrap"> Cell </td> </tr> <tr class="border-b bg-indigo-100 border-indigo-200"> <td class="text-sm text-gray-900 font-medium px-6 py-4 whitespace-nowrap"> Info </td> <td class="text-sm text-gray-900 font-light px-6 py-4 whitespace-nowrap"> Cell </td> <td class="text-sm text-gray-900 font-light px-6 py-4 whitespace-nowrap"> Cell </td> </tr> <tr class="border-b bg-gray-50 border-gray-200"> <td class="text-sm text-gray-900 font-medium px-6 py-4 whitespace-nowrap"> Light </td> <td class="text-sm text-gray-900 font-light px-6 py-4 whitespace-nowrap"> Cell </td> <td class="text-sm text-gray-900 font-light px-6 py-4 whitespace-nowrap"> Cell </td> </tr> <tr class="border-b bg-gray-800 boder-gray-900"> <td class="text-sm text-white font-medium px-6 py-4 whitespace-nowrap"> Dark </td> <td class="text-sm text-white font-light px-6 py-4 whitespace-nowrap"> Cell </td> <td class="text-sm text-white font-light px-6 py-4 whitespace-nowrap"> Cell </td> </tr> </tbody> </table> </div> </div> </div> </div>
Output html table

What can you do with the HTML TABLE code beauty tool?

Very simple, you just need to select the html file containing the table tag, or copy the html content of the website containing the table tag.

Then click the "Beautify HTML TABLE" button, then copy the results to use.

This tool is free and easy to use. Users do not need to install any other software.

The tool is compatible with all devices and all popular browsers.

Related tool