Sass till CSS
Kompilera Sass och SCSS till CSS online. Realtidskonvertering med expanderad eller komprimerad utdata, felrader och fullt stöd för variabler, mixins och nästling.
Vad är skillnaden mellan Sass och SCSS?
SCSS är den nyare, CSS-liknande syntaxen med klammerparenteser och semikolon. Sass (den indragna syntaxen) använder indrag och radbrytningar. Det här verktyget kompilerar båda - välj bara syntax i rullgardinsmenyn.
Vilka Sass-funktioner stöds?
Kompilatorn använder den officiella Dart Sass-motorn, så variabler, nästling, mixins, @include, funktioner, @use, @extend, styrdirektiv som @if och @each samt komprimerad utdatastil stöds alla.
Hur får jag komprimerad CSS?
Ställ in utdatastilmenyn på Komprimerad före kompilering. Mellanslag och det avslutande semikolonet tas bort, vilket ger den minsta möjliga stilmallen.
Varför visar felet ett radnummer?
När din kod har ett syntaxfel rapporterar Sass-motorn exakt rad och kolumn där tolkningen misslyckades, och verktyget visar det ovanför utdata så du snabbt kan åtgärda det.
Laddas min Sass-kod upp till en server?
Nej. Hela Dart Sass-motorn är buntad med sidan och kompilerar lokalt i webbläsaren. Dina stilmallar lämnar aldrig din enhet - säkert även för privata projekt.
Kan jag kompilera @import av lokala filer?
Nej. Kompilatorn arbetar på ett enda kodavsnitt i minnet och har ingen åtkomst till ditt filsystem, så filbaserade importer och @use av externa partialer kan inte lösas.
Fungerar det offline?
Ja. När sidan och kompilatorpaketet laddats en gång sker kompileringen helt på din maskin, utan anslutning.
Hur använder jag resultatet?
Kopiera den kompilerade CSS:en till urklipp eller ladda ner den som style.css med knapparna under utdata, och länka den i din HTML eller klistra in den i projektets stilmall.
Hur man använder Sass till CSS
Denna kompilator kör den officiella Dart Sass-motorn helt i din webbläsare. Klistra in SCSS eller indragen Sass och få ren CSS direkt — variabler, mixins, nästling och funktioner stöds, inget laddas upp.
- Klistra in din Sass eller SCSS i inmatningsfältet, eller tryck Exempel för att ladda en fungerande demo med variabel och mixin.
- Välj syntax (SCSS eller indragen Sass) och utdatastil (Expanded eller Compressed) i rullgardinsmenyerna.
- Med Live-kompilering på skapas CSS:en medan du skriver; annars trycker du på Kompilera för att köra manuellt.
- Vid ett syntaktiskt fel visas exakt radnummer och meddelandet ovanför utdata så att du snabbt kan åtgärda det.
- Använd Kopiera eller Ladda ner under utdata för att hämta din kompilerade stilmall som style.css.
Välj utdatastilen Compressed för att minifiera din stilmall — perfekt för produktionsbyggen direkt från källkoden.
Relaterade verktyg
- CSS-förskönare Formatera och försköna CSS-kod direkt. Konvertera minifierad CSS till läsbar kod med anpassningsbara alternativ.
- CSS-minifierare Gratis online CSS-minifierare. Komprimera och optimera CSS-kod omedelbart genom att ta bort mellanslag, kommentarer och onödiga tecken. Minska filstorleken för snabbare webbprestanda.
- CSS-gradientgenerator Skapa fantastiska CSS-gradienter visuellt. Generera linjära, radiella och koniska gradienter med flera färgstopp, vinklar och positioner. Kopiera produktionsklar CSS-kod omedelbart.
- CSS Flexbox-generator Visuell CSS Flexbox-generator med liveförhandsgranskning. Justera flex-egenskaper och få CSS-kod redo att använda.
- Chmod-kalkylator Gratis online chmod-kalkylator för att visualisera och beräkna Linux-filrättigheter med kryssrutor. Konvertera omedelbart mellan numerisk (755, 644) och symbolisk notation (rwxr-xr-x). Stöder speciella rättigheter som setuid, setgid, sticky bit.
- ASCII-tabell Komplett ASCII-teckenkodningsreferens med decimala, hexadecimala, oktala, binära koder, HTML-entiteter och teckenbeskrivningar. Omedelbar sökning och filtrering.
- HTTP-begäran Testare Testa REST API:er direkt i din webbläsare. Skicka GET-, POST-, PUT-, DELETE-förfrågningar med anpassade rubriker, kropp och parametrar. Se svarstatus, rubriker och JSON-kropp omedelbart.
- .htaccess-generator Generera Apache .htaccess-regler för omdirigeringar, omskrivningar, säkerhetsrubriker, cachelagring och mer.