使い方
- モードを選択
ツールバーで「整形（Beautify）」または「圧縮（Minify）」を選びます。
- CSSを入力
左側のテキストエリアにCSSコードを貼り付けるか入力し、「変換」ボタンをクリックします。
- 結果をコピー
「コピー」ボタンで整形済みCSSをクリップボードにコピーできます。
CSSフォーマッター の具体例
CSS整形
入力
.box{display:flex;padding:16px;color:#333}出力
.box {
display: flex;
padding: 16px;
color: #333;
}プロパティごとに改行とインデントが追加されます。
CSS圧縮
入力
.box {
display: flex;
padding: 16px;
color: #333;
}出力
.box{display:flex;padding:16px;color:#333}不要な空白、改行、コメントが除去されます。
特長
- CSS整形（Beautify）でプロパティごとにインデント
- CSS圧縮（Minify）で不要な空白・コメントを除去
- インデントサイズ（2/4スペース）の切り替え
- メディアクエリやネストされたルールの適切な処理
- コメント（/* */）の保持/除去の選択
- リアルタイムプレビュー対応
- ブラウザ内処理でプライバシー安全
よくある質問
SCSSやLessにも対応していますか？
基本的なCSS構文を整形するツールです。SCSSやLessの変数やミックスインなどの独自構文は正しく処理されない場合があります。
圧縮でどのくらいサイズが減りますか？
CSSの内容によりますが、整形済みCSSを圧縮すると一般的に20-40%程度のファイルサイズ削減が期待できます。
データはサーバーに送信されますか？
いいえ。すべての処理はブラウザ内で完結し、データが外部に送信されることはありません。