Less-input

Kompileret CSS

Hvad er Less til CSS?

Browsere forstår CSS, ikke Less-syntaks. Denne konverter omdanner Less-kode til standard-CSS, så du kan bruge variabler, indlejring og genbrugelige stilmønstre, mens du leverer browserkompatibelt output.

Brug den, når du vil have hurtig kompilering uden at konfigurere en byggepipeline. Alt kører lokalt i din browser, så koden forbliver privat, og konverteringen sker øjeblikkeligt.

Sådan bruger du Less til CSS-konverteren

Følg disse trin for at kompilere Less til browserklar CSS. Hvert trin bruger de faktiske knapper og paneler på denne side.

Indsæt, upload eller indlæs eksempel

Indsæt Less i det venstre panel Less-input eller klik på Upload for at indlæse en .less-fil. Klik på Eksempel for at se eksempel på abonnentkortstile med variabler og mixins. Eksempel på Less-input:

@primary: #2563eb;
@spacing: 12px;
.subscriber-card {
  padding: @spacing;
  .plan-badge { color: @primary; font-weight: 700; }
  &:hover { background: #eef2ff; }
}

Se den kompilerede CSS

Det højre panel Kompileret CSS viser outputtet med det samme. Variabler opløses, indlejring fladgøres, mixins udvides.

Kopier eller download

Klik på Kopier for at kopiere til udklipsholder, eller Download for at gemme som .css. Brug Ryd for at starte forfra. Al kompilering sker i din browser.

Relaterede CSS-værktøjer

Kompilering er typisk et trin i en stilarbejdsgang. Du kan også have brug for: