Форматтер и минификатор CSS
Сделайте CSS снова читаемым или сожмите его, чтобы сайт работал быстрее.
Вставьте CSS, откройте файл .css или перетащите его сюда
Сообщить о проблеме с этим инструментом
Как использовать Форматтер и минификатор CSS
Вставьте CSS
Вставьте таблицу стилей или откройте либо перетащите файл .css. Форматирование идёт прямо во время ввода.
Отформатируйте или минифицируйте
Форматирование выносит каждое правило и свойство на отдельную строку. Минификация удаляет комментарии, пробелы и всё, что не нужно браузеру.
Скопируйте или скачайте
Скопируйте результат или скачайте его как файл .css. При минификации видно размер до и после.
Почему стоит использовать Utils365
Умнее, чем удаление пробелов
Минификатор также сокращает цвета вроде #ff0000 до red, убирает единицы у нулей и удаляет пустые правила.
Порядок правил сохраняется
Правила никогда не объединяются и не переставляются, поэтому каскад работает точно как раньше и ничто ничего не переопределяет по-новому.
Лицензионные комментарии остаются
Комментарии, начинающиеся с /*!, остаются в минифицированном файле, как требуют многие open-source-лицензии.
Конфиденциально по умолчанию
CSS форматируется в вашем браузере и никуда не загружается.
Часто задаваемые вопросы
Насколько уменьшается CSS после минификации?
Обычно на 15–30%, больше, если в таблице стилей много комментариев. Сводка показывает точный размер до и после и процент экономии.
Может ли минификация сломать стили?
Она устроена так, чтобы не ломать. Значения переписываются только равнозначно, а правила сохраняют порядок, поэтому то, какое правило побеждает, не меняется.
Как развернуть минифицированный CSS?
Вставьте минифицированный CSS и выберите «Форматировать». Каждое правило и свойство окажется на отдельной строке с выбранным отступом. Удалённые комментарии вернуть нельзя.
Работает ли это с SCSS или Less?
Форматирование справляется с большей частью SCSS и Less, включая вложенность. Минификация ожидает обычный CSS, поэтому сначала скомпилируйте SCSS или Less.