JSON para HTML que pode colar sem se desculpar pelo layout
Ficheiros de configuração, payloads de webhook e exportações analíticas costumam chegar em JSON. Os programadores leem objetos aninhados; os outros não. Esta página transforma esses dados em tabelas ou listas HTML para o navegador, uma wiki ou um bloco CMS: cole ou importe JSON, escolha um layout e saia com markup intencional — não um dump de depuração. Muitos conversores só passam JSON para HTML no sentido estreito: uma fila larga de cabeçalhos com caminhos por pontos, bordas por defeito, sem tipografia real. Tecnicamente correto, difícil de partilhar. Se alguma vez pensou «isto não envio ao cliente», conhece a lacuna. Aqui estrutura e apresentação vão juntas: modo tabela para arrays de objetos, árvore e lista de definição para dados aninhados, tabela plana larga quando precisa do layout de uma linha de ferramentas antigas. A exportação de documento completo pode acrescentar um tema leve — Clean, Minimal ou Compact — para que espaçamento e tipografia fiquem certos na Pré-visualização antes de copiar. A conversão corre em local no navegador; o seu JSON não é enviado. HTML em bruto mostra as etiquetas, Pré-visualização HTML abre o playground da página inicial e Formatar JSON arruma saídas minificadas de logs.
Converter JSON para HTML com tabelas legíveis — não um muro de células
A procura por tabela JSON para HTML costuma significar «mostrar o meu array como tabela». O modo tabela faz isso: chaves partilhadas em colunas, cada elemento numa linha, com `<thead>` e células legíveis. Um objeto torna-se tabela de propriedades de duas colunas; valores aninhados podem aparecer como sub-tabela quando ajuda. Precisa da forma antiga de uma linha? A tabela plana larga coloca chaves como `items.0.name` numa única linha de cabeçalho — como muitos conversores de topo, não bonito, mas previsível para ferramentas a jusante. O modo árvore mapeia objetos e arrays aninhados em listas para depuração. A lista de definição serve glossários. Não precisa de escrever `<tr>` à mão nem de corrigir modelos.
O e-mail é onde estilos incorporados e em linha se separam — e onde muitos ficam presos. Uma exportação polida guarda tipografia e regras de tabela num bloco `<style>` no head. Gmail, Outlook e a maioria dos ESP removem esses blocos: o envio sai, o espaçamento desaparece. Desenhe com Incorporado no painel de saída; mude para Em linha antes de colar na newsletter ou no modelo transacional. O mesmo motor que a página CSS Inliner move regras para atributos `style` e remove `<style>` que já não servem. Keyframes, `:hover` e alguns pseudo-elementos não vão em linha — aparecem em Notas para saber o que não sobrevive à caixa de entrada.
Abrir o conversorTabelas com estilo por defeito
Temas e espaçamento na exportação de documento completo — não dumps com border="1" de conversores mínimos.
Incorporado → Em linha num clique
Desenhe com CSS em `<style>`, depois o interruptor de saída para atributos `style` prontos para e-mail.
Quatro modos de layout
Tabela, plana larga, árvore e lista de definição — conforme a forma do JSON.
Tabela JSON para HTML e caminhos de exportação
Do array da API ao markup pronto a colar — com pré-visualização, temas e CSS em linha opcional para e-mail.
Tabelas que parecem relatório, não grelha de depuração
Arrays de objetos têm cabeçalhos de coluna e separação de linhas; os temas acrescentam tipografia e bordas na exportação completa. Vê o resultado na pré-visualização antes de copiar — sem descobrir markup feio só depois de colar.
- Tabelas legíveis e temas — não dumps feios de uma linha
- Incorporado → Em linha para e-mail no painel de saída
- Tabela, plana, árvore e definição
- Corre em local no navegador
Como converter JSON para HTML na prática
Cole ou importe JSON
Largue saída de API minificada no painel esquerdo ou importe um `.json`. Formatar JSON corrige a indentação quando os logs chegam numa linha. Corrija erros de análise antes de escolher o layout.
Escolha layout e tema de pré-visualização
Tabela para arrays de objetos; árvore ou lista de definição para documentos aninhados; plana larga só se precisar de colunas com caminhos por pontos. Ao descarregar: fragmento vs documento completo e tema — pré-visualização como o ficheiro guardado.
Revise a Pré-visualização, depois HTML em bruto
A pré-visualização mostra o render. HTML em bruto as etiquetas exatas a copiar. Para navegador ou CMS, CSS incorporado no documento completo costuma bastar. Para a caixa de entrada: passo seguinte.
Mude para Em linha para e-mail, depois exporte
Ative Em linha no cabeçalho de saída para mover regras de `<style>` para os elementos. Leia Notas sobre seletores omitidos. Copie HTML, descarregue `.html` ou Pré-visualização HTML no playground — como nas outras ferramentas.
FAQ: JSON para HTML
Converter JSON para HTML agora
Tabelas legíveis, pré-visualização com tema e CSS em linha quando o destino é a caixa de entrada.
JSON para HTML
- Tabelas com estilo — não dumps com bordas nuas
- CSS Incorporado ou Em linha no painel de saída
- Conversão local, cópia ou descarregamento
- No signup; use the tool in the browser
Para e-mail, teste após Em linha e envie uma mensagem de teste — os clientes ainda variam.
De JSON para HTML que vai mesmo enviar
Tabelas com tipografia real — mais estilos em linha num clique para e-mail.