RUNWEBTOOLS
Nederlands

CSS-formatter

Verfraai en ordent rommelige of geminificeerde CSS in je browser.

Live — formatteert terwijl je typt

Voorbeelden

Geminificeerde CSS verfraaien

Invoer

.btn{color:#fff;background:#000;padding:8px 16px;}

Uitvoer

.btn {
  color: #fff;
  background: #000;
  padding: 8px 16px;
}

Inconsistente spatiëring opschonen

Invoer

a{color:blue;}  a:hover{color:red;}

Uitvoer

a {
  color: blue;
}

a:hover {
  color: red;
}

Over deze tool

Deze gratis online CSS-formatter zet rommelige of geminificeerde stylesheets om naar nette, netjes ingesprongen CSS — een snelle CSS-verfraaier en pretty-print-tool. Plak je CSS, kies een inspringstijl, en het geformatteerde resultaat verschijnt direct. Alles draait in je browser zonder upload, dus je code verlaat je apparaat nooit.

Zo gebruik je het

  1. Plak je CSS in het invoervak (klik op Voorbeeld om te proberen).
  2. Kies een inspringing van 2 spaties, 4 spaties of een tab.
  3. Lees de verfraaide CSS in het uitvoervak rechts.
  4. Kopieer het resultaat met de Kopiëren-knop.

Wanneer een CSS-formatter gebruiken

Herformatteren helpt als je gecomprimeerde CSS uit een gebouwde bundle kopieert, een stylesheet met inconsistente spatiëring erft of een regel wilt lezen voordat je die bewerkt. Een consistente inspringing maakt selectors en nesting duidelijk en houdt diffs schoon.

Veelgestelde vragen

Is deze CSS-formatter gratis?

Ja — een volledig gratis online CSS-formatter en -verfraaier zonder registratie en zonder limieten. Formatteer en spring zoveel CSS in als je wilt.

Wordt mijn CSS naar een server geüpload?

Nee. Dit is een tool zonder upload — je CSS wordt volledig in je browser geformatteerd, dus de code verlaat je apparaat nooit. Veilig voor privé- of interne stylesheets.

Wat doet de CSS-verfraaier?

Hij zet elke regel en declaratie op een eigen regel, normaliseert spatiëring rond accolades, dubbele punten en puntkomma's, en springt alles opnieuw in, zodat geminificeerde of rommelige CSS leesbaar wordt.

Kan ik de inspringing kiezen?

Ja — kies 2 spaties, 4 spaties of tabs. Je keuze wordt in de browser onthouden voor de volgende keer.

Werkt het met SCSS of Less?

Het verwerkt de meeste SCSS- en Less-syntaxis goed voor inspringen en opschonen, omdat de structuur op CSS lijkt. Het formatteert in plaats van te compileren — het vouwt geen nesting of variabelen uit.

Vouwt het geminificeerde CSS uit?

Ja. Plak een stylesheet op één regel of geminificeerd en het wordt weer uitgevouwen tot een net ingesprongen, leesbare set regels.

Werkt het offline en op mobiel?

Zodra de pagina is geladen draait het lokaal, dus het blijft werken bij een wisselvallige verbinding, en de lay-out is volledig responsief op telefoons en tablets.

Gerelateerde tools

JSON-formatter

JSON direct in je browser formatteren, valideren en verfraaien.

HTML-formatter

Verfraai en spring rommelige of geminificeerde HTML in je browser in.

JavaScript-formatter

Verfraai en spring geminificeerde of rommelige JavaScript in je browser in.

SQL-formatter

Formatteer SQL-query’s met sleutelwoorden in hoofdletters.