Перейти к содержимому
Toolars
Каталог
Сообщить об ошибке

Разработка · утилита · Локально

Форматирование CSS

CSS Formatter

Переформатируйте CSS в читаемые согласованные правила с отступами в два или четыре пробела — строгий разбор идёт в локальном Worker.

Путь задачи / от ввода к результату

Вставьте свой CSS

Работает локально · Ничего не загружается на сервер

Как работает Форматирование CSS, конфиденциальность и похожие инструменты

Путь задачи / от ввода к результату

Как отформатировать CSS

  1. 01

    Вставьте свой CSS

    Вставьте исходный код до 256 KiB UTF-8. Для форматирования выберите два или четыре пробела.

  2. 02

    Выберите отступ

    Выберите два или четыре пробела. Образец уже загружен; настройка применяется после нажатия «Форматировать».

  3. 03

    Форматируйте настоящим парсером

    Нажмите «Форматировать». Prettier разбирает и перепечатывает CSS с выбранным отступом и шириной строки 100 колонок; проверьте целевую страницу.

  4. 04

    Проверьте результат и статистику

    Сравните число байтов UTF-8 на входе и выходе и процент экономии. Отрицательная экономия означает рост размера; проверьте результат перед копированием или скачиванием.

  5. 05

    Скопируйте или скачайте результат

    Используйте «Копировать результат» для буфера обмена или «Скачать», чтобы сохранить таблицу как toolars.css. Когда ждёт следующая таблица стилей, «Сбросить» очищает ввод, вывод и параметры за один шаг.

Факты об инструменте

Обработка
В вашем браузере
Ввод покидает устройство
Никогда
Хранение
Ничего не сохраняется
Цена
Бесплатно

Ваши данные остаются в браузере.

Форматирование CSS использует проверенный путь локального выполнения и не создаёт скрытую историю ввода и вывода.

Локальное выполнение

Работает внутри текущей вкладки браузера.

Никакой скрытой обработки

Активные данные инструмента никогда не становятся записями документов Toolars.

Аккаунт не требуется

Используйте основной сценарий без создания профиля. Избранное синхронизируется с аккаунтом после входа.

Мгновенный сброс

Закройте вкладку — и рабочие данные исчезнут.

Когда пригодится Форматирование CSS

Ревью кода

Упростите проверку исходника, прежде чем делиться им с другим разработчиком.

Артефакты сборки

Создавайте компактный HTML, CSS или JavaScript, не исполняя исходный код.

Готовые к копированию сниппеты

Отформатируйте конкретный пример и перенесите его сразу в документацию или редактор.

Что на самом деле делает Форматирование CSS

Сжатой таблице стилей нужен удобный для ревью diff. Вставьте её, выберите отступ в два или четыре пробела, отформатируйте и проверьте селекторы и порядок резервных правил на целевой странице. Размер не доказывает, что менялись только пробелы.

Частые вопросы

Каков лимит размера?
Вход ограничен 256 KiB, выход — 512 KiB. Для запуска и выполнения локального Worker отведено по пять секунд; изменение исходника или кнопка отмены останавливают задачу.
Меняет ли форматирование работу моего CSS?
Форматирование меняет оформление текста, но не проверяет вёрстку и поддержку браузером. Проверьте селекторы, пользовательские свойства и каскад на целевой странице; сохраните оригинал.
Почему мой CSS отклонён?
Это парсер, а не «причёсыватель» текста: сломанный синтаксис вроде незакрытой скобки или лишнего символа останавливает запуск, а строка состояния называет строку и столбец проблемы. Некорректный ввод не даёт никакого результата, поэтому частичная или «угаданная» таблица никогда не попадёт в буфер обмена случайно.
Можно ли получить табуляцию или отступ в восемь пробелов?
Нет. «Размер отступа» предлагает ровно 2 пробела и 4 пробела — два соглашения, которым уже следует большинство таблиц стилей. Если в вашем проекте другая ширина, отформатируйте здесь с более близким вариантом, а остальное пусть нормализует форматтер вашего редактора.
Что сообщает строка статистики?
Строка показывает число байтов UTF-8 до и после преобразования и разницу. Форматирование может увеличить размер; числа не доказывают корректность и совпадение вида.
Загружается ли моя таблица стилей куда-либо?
Нет. Исходник разбирается локальным Worker, не исполняется, не отправляется и не сохраняется. Успешный разбор не доказывает корректность приложения или совместимость.

Продолжить: Разработка

Связанные задачи, а не тупик.

Перейдите в другую сфокусированную рабочую область, не возвращаясь к полному каталогу.

Код в изображение

Code to Image Converter

Экспортируйте код с подсветкой в PNG или SVG: шесть языков, светлая и тёмная темы, номера строк, заголовок окна и масштаб 1x или 2x.

Создание

Генератор URL-слагов

URL Slug Generator

Превращайте заголовки в чистые слаги с дефисами или подчёркиваниями: диакритика снимается, амперсанды разворачиваются, нелатиница сохраняется.

Создание

Генератор теней React Native

React Native Shadow Generator

Сравнивайте устаревшие тени и boxShadow в React Native, настраивайте вывод для iOS и Android рядом и копируйте код StyleSheet.

Создание

Кодирование / декодирование Base64

Base64 Encoder/Decoder

Кодируйте Unicode-текст в Base64 и обратно с живой валидацией, режимами URL-safe и UTF-8 и кнопкой обмена для круговых проверок.

Конвертация