UTILS.
100% у браузері
{ }

CSS Beautifier

Форматуйте та відступайте мініфікований CSS з належними переходами рядків і відступами.

— результат з’явиться тут —

Про цей інструмент

CSS Beautifier — це безкоштовний браузерний форматувальник, який перетворює стиснутий або неохайний CSS на чисту, послідовно відформатовану структуру. Спершу він згортає наявні пробіли, а потім заново вибудовує структуру: кожне правило й оголошення потрапляє на власний рядок, відкривна фігурна дужка залишається на рядку селектора, закривна дужка переходить на власний рядок, а вкладені блоки отримують відступ у два пробіли на рівень.

Він працює виключно з пунктуацією, що розділяє селектори, блоки й оголошення, додаючи один пробіл після двокрапки кожного оголошення та один пробіл перед відкривною дужкою. Імена властивостей і значення залишаються незмінними, тож змінюється лише розстановка пробілів, а стилі не зачіпаються. Форматування виконується наживо під час набору, повністю у вашому браузері — без завантажень на сервер, без облікових записів, без відстеження, і працює офлайн.

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

Поширені запитання

Чи змінює він мої стилі?
Ні. Він лише коригує пробіли та відступи — імена властивостей, значення й селектори залишаються точно такими, як написано, тож відображуваний результат ідентичний.
Чи надсилається мій CSS кудись?
Ні. Форматування виконується локально в JavaScript без завантажень на сервер, без облікових записів і без відстеження, тож воно також працює офлайн.
Чи може він розгорнути стиснутий CSS?
Так. Він спершу згортає всі наявні пробіли, а потім заново розставляє відступи, тож і однорядковий стиснутий CSS, і розлогий багаторядковий CSS дають однаково охайний результат.
Чи перевіряє чи виправляє він мій CSS?
Ні. Він упорядковує пробіли навколо дужок, крапок з комою та двокрапок, але не перевіряє й не виправляє CSS, тож будь-які наявні синтаксичні помилки передаються без змін.

Більше інструментів