Click a cell to select it, shift-click another cell to select a rectangle, then Merge selected cells. Copy cells from Excel or Google Sheets and paste anywhere in the grid to replace it with your pasted data.
Preview
HTML
🔒 Privado por diseño: todo funciona localmente en tu navegador; nada se sube nunca a ningún servidor.
Escrito y mantenido por Javi Morales·Última actualización
Cómo crear una tabla HTML
Pulsa + Add row / + Add column para dimensionar la cuadrícula, o pega directamente un rango de celdas copiado de Excel o Google Sheets para rellenarla en un solo paso.
Haz clic en una celda y escribe, o haz clic en una celda, shift+clic en otra para seleccionar un rectángulo, y pulsa Merge selected cells para combinarlas.
Activa First row is a header y/o First column is a header, elige un estilo, y opcionalmente activa el contenedor responsivo con desplazamiento.
Pulsa Copy HTML para obtener el código en bruto, Copy rendered table para pegar una tabla ya con estilo directamente en un documento, o Download .html para guardarla como archivo.
Por qué crear una tabla HTML de forma visual
Escribir a mano las etiquetas <table>, <tr>, <th> y <td> (sobre todo en cuanto alguna celda empieza a abarcar varias filas o columnas) es lento y fácil de estropear sutilmente: basta con olvidar una etiqueta de cierre o que un colspan no coincida con la fila de arriba para que toda la tabla se vea descuadrada. Un editor de cuadrícula visual te deja ver exactamente lo que estás construyendo mientras lo construyes, añadir o quitar filas y columnas sobre la marcha, y combinar celdas seleccionándolas en lugar de calcular los spans a mano.
Pegar directamente desde una hoja de cálculo es la otra mitad del ahorro de tiempo, la mayoría de las tablas reales empiezan siendo un rango de celdas que alguien ya tiene en Excel o Google Sheets, y volver a escribir esos datos en un formulario web es pura fricción. Pégalos, ajusta cabeceras y combinaciones si hace falta, elige un estilo, y copia el HTML terminado.
Tus datos de tabla nunca salen de tu dispositivo
Los datos de hoja de cálculo pegados en una herramienta como esta suelen ser mucho más que una demostración, tablas de precios, tablas comparativas, informes internos, datos de clientes. Esta herramienta crea la tabla enteramente en la memoria de tu propio navegador; no hay paso de subida, no hay procesamiento en un servidor, y no queda ninguna copia de tus datos en ningún sitio salvo tu propio dispositivo.
Usos habituales
Convertir una tabla comparativa (planes de precios, matrices de funciones, hojas de especificaciones) copiada de una hoja de cálculo en HTML limpio para una landing page o una entrada de blog.
Crear una tabla para una plantilla de correo con celdas de cabecera combinadas y estilo en línea que sobrevive al pegarse en la mayoría de los clientes de correo.
Recrear una tabla de una exportación de un CMS o una página de wiki donde algunas celdas abarcan varias filas o columnas, sin calcular colspan/rowspan a mano.
¿Tienes JSON en lugar de un rango de hoja de cálculo? El Conversor de JSON a Tabla HTML comparte exactamente estos mismos cinco estilos y convierte un array JSON directamente en una tabla con selección de columnas en lugar de un editor de cuadrícula.
¿Necesitas una tabla en Markdown para un README o una página de wiki en lugar de HTML en bruto? Mira el Generador de Tablas Markdown, que usa este mismo enfoque de editor de cuadrícula.
¿Quieres la tabla terminada como PDF en lugar de una página web? Descárgala como archivo .html aquí, y luego súbela al Conversor de HTML a PDF.
Cómo funciona, en imágenes
Generador de Tablas HTML en pleno proceso: una cuadrícula editable con añadir fila, añadir columna y combinación de celdas (clic en una celda, mayús+clic en otra para seleccionar un rectángulo y combinar) sobre el HTML que genera, y las celdas se pueden pegar directamente desde Excel o Google Sheets.Dónde ocurre el trabajo en una página de SysFenix que no tiene ninguna entrada de archivo: la herramienta llega como JavaScript normal dentro de la página, calcula la respuesta en tu propio dispositivo y la muestra ahí mismo, de modo que la subida, la cola y el registro en servidor que necesita una herramienta online típica no ocurren nunca.
Preguntas frecuentes
¿Se suben mis datos de tabla a un servidor?
No. El editor de cuadrícula, el manejo del pegado y el HTML que genera funcionan enteramente dentro de tu navegador usando JavaScript normal, no hay ningún paso de subida ni procesamiento en un servidor. Los datos de una tabla suelen venir directamente de una hoja de cálculo llena de registros reales, así que nada de eso sale nunca de tu dispositivo.
¿Cómo funciona pegar desde Excel o Google Sheets?
Copia un rango de celdas en Excel o Google Sheets, haz clic en cualquier parte de la cuadrícula aquí, y pega (Ctrl/Cmd+V). Los datos que esas aplicaciones ponen en el portapapeles están separados por tabulaciones, con cada fila en una línea, y pueden envolver un campo entre comillas dobles cuando contiene una tabulación, una comilla o un salto de línea incrustado, esta herramienta analiza exactamente ese formato (no una simple división por tabulaciones), así que una celda pegada con su propio salto de línea o una tabulación adicional llega correctamente como una sola celda en lugar de partirse. Pegar reemplaza toda la cuadrícula con los datos pegados.
¿Cómo funciona combinar celdas, y puedo combinar celdas que ya forman parte de otra combinación?
Haz clic en una celda, luego shift+clic en otra celda para seleccionar un bloque rectangular, y luego pulsa "Merge selected cells". La celda combinada conserva el texto que había en su esquina superior izquierda y recibe atributos reales colspan/rowspan en el HTML generado, las celdas que absorbe nunca se renderizan como celdas propias, así que el resultado siempre es un marcado de tabla válido. Combinar un rectángulo que se solapa con una combinación ya existente se rechaza con un mensaje claro en lugar de anidar combinaciones; primero deshaz la combinación existente (lo que restaura cada celda dentro de ella, conservando el texto que tuviera), y luego combina el rectángulo más amplio que quieras.
¿Qué pasa con una fila o columna que forma parte de una combinación si la elimino?
Eliminar una fila o columna que atraviesa una combinación deshace primero toda esa combinación, devolviendo sus celdas a un estado individual normal, y luego elimina la fila o columna como de costumbre, así nunca te quedas con una combinación que apunta a celdas que ya no encajan.
¿Los estilos son los mismos que los del conversor de JSON a Tabla HTML?
Sí, a propósito, Plain, Minimal, Striped rows, Bordered y Dark mode son exactamente los mismos cinco estilos, compartiendo exactamente las mismas definiciones, así que una tabla creada aquí y otra creada desde JSON allí se ven idénticas si eliges el mismo estilo. Cada estilo se escribe como atributos `style` en línea en vez de una hoja de estilos enlazada, así que el HTML copiado se ve bien de inmediato en un CMS, un correo o una wiki, sitios que a menudo eliminan los bloques `<style>` independientes.
Veo textos de la interfaz en inglés, botones como "Merge selected cells" o "Copy HTML", los nombres de los estilos, y mensajes de error como "No data found in the pasted text.", ¿es un error?
No, es una limitación conocida y honesta, no un fallo de traducción. Toda la lógica, el modelo de cuadrícula, el análisis del pegado desde hoja de cálculo, la combinación de celdas y la generación del HTML con su escapado, es completamente independiente del idioma y funciona igual de bien con datos en español (incluidos acentos y la ñ). Pero el componente interactivo en sí (los botones, las casillas, los nombres de los cinco estilos y los mensajes de error) es un único componente compartido en inglés que se usa sin cambios en ambos idiomas de esta página. El resultado visual del estilo elegido sí se aplica correctamente, y el texto que tú mismo escribas en las celdas se copia exactamente tal cual lo escribiste.
¿Es seguro pegar texto que contenga HTML o algo parecido a un script en una celda?
Sí. El texto de cada celda se escapa como HTML antes de incluirse en la tabla generada, así que un valor como `<script>alert(1)</script>` pegado en una celda aparece como texto visible inofensivo en el resultado, en lugar de tratarse como marcado real.
¿Qué hace la casilla "Wrap in a responsive (scrollable) container"?
Envuelve la `<table>` generada en un `<div style="overflow-x:auto">...</div>`, así que una tabla ancha se desplaza horizontalmente dentro de su propio recuadro en una pantalla pequeña, en lugar de desbordarse o romper el diseño de la página que la rodea, un patrón habitual para incrustar una tabla con muchas columnas en una entrada de blog o un artículo.
Convierte un array JSON en una tabla HTML, aplana objetos anidados, elige y reordena columnas, elige un estilo, y copia el HTML o la tabla ya renderizada.
Crea una firma de correo HTML profesional desde un formulario y cópiala directamente en Gmail u Outlook. Tus datos nunca salen de tu navegador. Gratis.
