CSS フォーマッター
CSS をワンクリックで整形または圧縮。プロパティのアルファベット順ソートに対応。@media、@keyframes など全ての標準 at-rule をサポート。
このツールは役に立ちましたか？
よくある質問
CSS の整形とは何ですか？
CSS 整形（フォーマット）は、圧縮されたり書式が統一されていない CSS を再整理します。各宣言を独立した行に配置し、ルールブロック内を適切にインデントし、ルール間に空行を挿入して可読性を向上させます。純粋に見た目の調整であり、レンダリング結果は同一です。
プロパティソートの利点は何ですか？
プロパティソートは各ルールブロック内の宣言をアルファベット順（A→Z）に並べ替えます。ソートされた CSS は特定のプロパティを見つけやすく、重複の回避にも役立ちます。アルファベット順などのスタイルガイドはチーム全体の一貫性維持に貢献します。
CSS 圧縮はページの見た目に影響しますか？
いいえ。CSS 圧縮は空白、コメント、ルールブロック末尾のセミコロンを削除するだけで、これらは意味的に無関係です。ブラウザは圧縮された CSS とフォーマットされた CSS を同一に解析します。圧縮後の CSS は通常 20〜40% 小さくなります。
@media クエリや @keyframes に対応していますか？
はい。@media、@keyframes、@supports、@font-face などの at-rule を認識し、内部ブロックを適切にインデントします。ブロックを持たない @import や @charset は単一行のステートメントとしてフォーマットされます。
SCSS や Less を処理できますか？
フォーマッターは標準 CSS 構文を処理し、SCSS/Less ファイルの有効な CSS 部分は正常に処理されます。変数（$var）、ネスト、ミックスイン（@mixin）などの SCSS 固有の機能は非標準の CSS 構文であるため、正しくフォーマットされない場合があります。
プロジェクトで CSS を自動フォーマットするには？
Prettier と .prettierrc 設定、または Stylelint と stylelint-config-prettier プリセットを使用できます。Tailwind CSS プロジェクトでは Tailwind Prettier プラグインでユーティリティクラスをソートできます。VS Code の組み込み CSS フォーマッター（Shift+Alt+F）もローカルでの簡易フォーマットに便利です。