このツールについて
CSS Beautifier は、圧縮された、あるいは乱雑な CSS を、インデントの揃った読みやすいレイアウトに整形する無料のブラウザ内フォーマッターです。まず既存の空白を取り除き、次に構造を一から組み立て直します。各ルールと宣言はそれぞれ独立した行に配置され、開き波括弧はセレクタと同じ行に残り、閉じ波括弧は独立した行に落とされ、ネストされたブロックは1レベルにつきスペース2つずつインデントされます。
セレクタ・ブロック・宣言を区切る記号だけを対象に動作し、各宣言のコロンの後にスペース1つ、開き波括弧の前にスペース1つを加えます。プロパティ名と値はそのまま残されるため、変わるのは空白だけでスタイリングには影響しません。整形は入力に合わせてリアルタイムに、すべてブラウザ内で実行されます。アップロードもアカウントも追跡もなく、オフラインでも動作します。
ビルド出力から取り出した圧縮済みスタイルシートを読んだり、差分を取ったり、手で編集したりする必要があるとき、あるいは1行のスニペットを読みやすい形に展開したいときに便利です。CSS を貼り付け、出力ボックスで整った結果を確認し、ワンクリックでコピーできます。
よくある質問
スタイルが変わってしまいますか？
いいえ。調整するのは空白とインデントだけで、プロパティ名・値・セレクタは書かれたとおりに保たれるため、レンダリング結果は同一です。
CSS はどこかに送信されますか？
いいえ。整形は JavaScript でローカルに実行され、アップロード・アカウント・追跡は一切ないため、オフラインでも動作します。
圧縮された CSS を展開できますか？
はい。まず既存の空白をすべて取り除いてから一からインデントし直すため、1行に圧縮された CSS も、複数行に散らばった CSS も、同じ整った出力になります。
CSS を検証したり修正したりしますか？
いいえ。波括弧・セミコロン・コロンまわりの空白を整えるだけで、CSS のチェックや修正は行いません。そのため、既存の構文エラーはそのまま残ります。