Generador de tablas HTML

Todas las herramientas

Edita celdas o importa CSV/TSV, configura la tabla, revisa la vista previa y copia el HTML listo.

Datos de la tabla

Pega datos de un archivo CSV o copia celdas de una hoja de cálculo y luego selecciona Importar datos.

Vista previa

HTML generado

Acerca de este generador de tablas HTML

Esta herramienta crea tablas HTML semánticas desde una cuadrícula editable o datos CSV y TSV importados. Genera encabezados, filas, caption opcional y un contenedor responsivo.

El fragmento generado usa estilos inline para que bordes, espaciado, alineación y filas alternas funcionen inmediatamente.

Cómo usarlo

  1. Edita las celdas directamente o importa datos CSV o TSV.
  2. Añade o elimina filas y columnas, y elige las opciones de tabla.
  3. Revisa la vista previa y copia el HTML generado.

Consejos

  • Usa la primera fila como encabezados para generar un thead accesible con th y scope.
  • Añade un caption breve cuando la tabla necesite contexto adicional.
  • Mantén habilitado el contenedor responsivo para tablas anchas en móviles.
  • Usa HTML Attribute Sorter / Cleaner después si prefieres otro orden de atributos.

Checks de estructura de tabla

Scope de encabezados

Use celdas de encabezado cuando columnas o filas necesiten labels. Ayuda a screen readers y a entender tablas grandes.

Contexto con caption

Un caption breve ayuda cuando la tabla aparece lejos del texto explicativo o se reutiliza en documentación.

Ancho responsivo

Las tablas anchas deben desplazarse horizontalmente en pantallas pequeñas en vez de comprimir texto en columnas ilegibles.

Limpieza de datos

Revise CSV o TSV importado para columnas vacías, fórmulas copiadas, tabs extra y saltos de línea accidentales.

Comprobaciones de HTML table antes de copiar generated markup

Generated tables ahorran tiempo, pero accessibility, responsive behavior, captions y calidad de imported data aún requieren revisión.

Usa semantic headers

Activa header cells y correct scope cuando rows o columns necesitan labels para screen readers y datasets grandes.

Añade captions útiles

Usa captions cuando la tabla necesita contexto fuera del párrafo cercano o puede reutilizarse en documentación.

Comprueba responsive width

Previsualiza tablas anchas en mobile para que columns hagan scroll o wrap sin volver los datos ilegibles.

Limpia imported data

Revisa CSV o TSV imports por empty columns, copied formulas, extra tabs y accidental line breaks.

Herramientas relacionadas

Estas herramientas también pueden resultarle útiles.

Preguntas frecuentes sobre tablas HTML

¿Puedo importar datos de una hoja de cálculo?
Sí. Pega CSV separado por comas o datos separados por tabulaciones copiados de una hoja de cálculo.
¿La tabla generada funciona en móviles?
Sí. La opción responsiva envuelve la tabla en un contenedor con desplazamiento horizontal.
¿El HTML generado es accesible?
Con encabezados habilitados, la primera fila se genera como encabezados de columna con scope dentro de thead. También puedes añadir caption.
¿Los datos se envían al servidor?
No. La edición, importación, vista previa y generación ocurren localmente en tu navegador.