CSS整形・ミニファイ
CSS を読みやすく整形、または配布用にミニファイ
ローカル実行
loading…
このツールについて
ミニファイされた CSS やコピペで集めた CSS を 1 宣言 1 行のルールに展開するか、スタイルシートを本番用に圧縮します。ビューティファイアーはインデントと波括弧の位置を正規化し、ミニファイアーはコメントを取り除き、空白を畳み、末尾のセミコロンを落とします — 文字列、url(...) の中身、calc() 式には手を付けません。
このミニファイアーは、やらないことについて隠しごとがありません。セレクターのリネーム、重複ルールのマージ、色の書き換えは行いません。だからこそ出力は予測可能で、ハックやベンダープレフィックスを含むものも含め、どんなスタイルシートにも安全です — 貼り付けて、ミニファイして、出荷するだけです。
ここにある他のツールと同じく、処理はローカルです。未リリースのデザインシステムのコードはブラウザ内に留まります。
よくある質問
- ミニファイで CSS はどのくらい小さくなりますか?
- 手書きの CSS なら通常 15–30% で、大半はインデントとコメントの分です。サーバーの gzip も同じ冗長性の多くを取り除くため、転送サイズの差は生のバイト数が示唆するより小さくなります — それでもミニファイしましょう。パース時間も削れます。
- calc()、カスタムプロパティ、メディアクエリに対して安全ですか?
- 安全です。calc() 内のスペースは意味を持つため保持されます。カスタムプロパティとその var() 参照はただの宣言なのでそのまま生き残り、@media などの at 規則も構造を保ちます。
- なぜ子孫セレクターのスペースは残るのですか?
- 「nav a」と「nava」は別のものを選択するからです — このスペースは整形ではなく結合子です。ミニファイアーが取り除くのは、構文上の意味を持たない空白だけです。
- LESS/SCSS と CSS の相互変換はできますか?
- いいえ — プリプロセッサーの構文に必要なのは整形ではなくコンパイルです。CSS としても有効なプレーンな SCSS は問題なく整形できますが、入れ子のルールやミックスインは整形できません。