🎨 LESS till CSS-kompilator

Klistra in LESS-kod och kompilera den till CSS direkt med den officiella less.js-motorn. Stöd för variabler (@var), nästning, mixins, operationer och inbyggda funktioner.

🔒 Kompileringen körs helt i din webbläsare - din kod skickas aldrig till en server. Även less.js-paketet levereras från den här webbplatsen, inte från ett CDN.

LESS-inmatning

CSS-utdata

Fler utvecklarverktyg

🧾 JSON-formaterare 🗄️ SQL-formaterare ⚛️ SVG → JSX-konverterare

GUIDE

Las mer

1. Vad är LESS

LESS (Leaner Style Sheets) är en CSS-preprocessor som lägger till programmeringsfunktioner - variabler, nästning, mixins och operationer - ovanpå CSS. Webbläsare förstår bara vanlig CSS, så LESS måste kompileras till CSS innan publicering. Det här verktyget kör den officiella less.js-motorn i din webbläsare för att göra den konverteringen direkt.

2. Viktiga funktioner

Hantera färger och storlekar på ett ställe med variabler (@brand: #4A90D9;), och spegla din markup-struktur genom att nästla selektorer. Bygg återanvändbara stilblock med mixins (.rounded(6px)), och använd beräkningar som (@pad * 2) samt inbyggda färgfunktioner som darken() och lighten().

3. Webbläsarkompilering och säkerhet

Det här verktyget kompilerar helt i din webbläsare och laddar aldrig upp din inmatning. Av säkerhetsskäl är LESS:s inline-JavaScript-funktion (backtick-syntax) avstängd, så det körs säkert utan eval. För större projekt kan du integrera LESS i din byggkedja (webpack, Vite, lessc, etc.).

Vanliga fragor

Skickas min LESS-kod till en server?

Nej. Kompileringen sker helt i webbläsarens JavaScript och koden skickas aldrig någonstans.

Kan jag använda @import för att hämta externa filer?

I webbläsaren är åtkomst till externa filer begränsad, så fjärr-@import kan misslyckas. Det här verktyget passar bäst för att kompilera enskilda kodsnuttar i en fil.

Kan jag använda LESS inline-JavaScript (backticks)?

Nej. Funktionen för JavaScript-utvärdering är avstängd av säkerhetsskäl. Alla standardfunktioner - variabler, mixins, operationer - fungerar som vanligt.

Kompilerar den även SCSS/Sass?

Nej, det här verktyget är bara för LESS. LESS och SCSS har olika syntax.