このツールについて

HTML を整形して見やすくします。入れ子ごとにインデントされ、短い要素は 1 行のまま、<pre>・<script>・<style> の内容は変更されません。無効なマークアップは修正されないため、バリデーターは引き続き必要です。

使い方

圧縮されたマークアップを貼り付けて整形を実行し、タグの対応が崩れていないか確認したうえで、エディターに戻して作業を続けてください。

サンプルは 1 行にまとめられたコンパクトなヒーローブロックです。

入力

<section class="hero"><h1>CSS to Tailwind</h1><p>Convert utilities in the browser.</p><a href="/">Open</a></section>

出力

<section class="hero">
  <h1>CSS to Tailwind</h1>
  <p>Convert utilities in the browser.</p>
  <a href="/">Open</a>
</section>

インデントが想定外の位置までずれる場合、元のマークアップで閉じタグが抜けていることがほとんどです。

HTML ビューティファイアと HTML フォーマッターは違いますか?

いいえ。どちらも入れ子のマークアップを再インデントするので、このページ 1 つで両方の検索に対応しています。

何は変更されず、無効な HTML は修正されますか?

<pre>・<textarea>・<script>・<style> の中身は書いたままです。ツールは再インデントだけを行うため、閉じ忘れや誤った入れ子はそのまま残ります。構造が重要なときはバリデーターを使ってください。