Hoppa till innehåll

CSS till Tailwind Konverterare

Konvertera CSS-egenskaper till Tailwind CSS-hjälpklasser. Stödjer layout, avstånd, typografi, färger och mer. Se omatchade egenskaper. Gratis, 100 % i din webbläsare.

Vad är CSS till Tailwind-konvertering?

Tailwind CSS är ett utility-first CSS-ramverk där du stilar element med fördefinierade klasser som flex, p-4, och text-center istället för att skriva anpassad CSS. Detta verktyg mappar vanliga CSS-egenskaper till deras Tailwind-motsvarigheter. Klistra in CSS-deklarationer och få motsvarande Tailwind-klasssträng. Egenskaper utan direkt Tailwind-matchning visas separat.

Stödda konverteringar

Layout — display, position, flex, grid-egenskaper. Avstånd — padding, margin, gap, width, height med Tailwinds avståndsskala. Typografi — font-size, font-weight, text-align, text-transform, letter-spacing, line-height. Färger — background-color, color, border-color med hexadecimala värden (som godtyckliga värden). Ramar — border-radius mappad till Tailwinds rounded-skala. Effekter — opacity, cursor, overflow, visibility, white-space. Godtyckliga värden — hexfärger konverteras till Tailwind godtycklig-värde-syntax som bg-[#3b82f6].

Integritet

All konvertering körs 100 % i din webbläsare. Ingen data skickas till någon server.