Dokáže převést CSS na Tailwind?

Ano. Před exportem nejbližšího seznamu tříd Tailwind vložte blok deklarace CSS a Tailfind jej použije na ukázkový prvek.

Jsou vlastní hodnoty zachovány?

Tailfind mapuje hodnoty na výchozí nástroje Tailwind, když je to možné, a udržuje jiné než výchozí hodnoty viditelné jako libovolné nástroje namísto jejich skrývání.

Mám vložit úplnou šablonu stylů?

Převodník CSS je určen pro deklarační bloky. Převaděč HTML/CSS použijte, když potřebujete selektory, třídy, vnořené značky nebo úplnější šablonu stylů.

Převodník CSS na Tailwind

Vložte blok deklarace CSS a převeďte vykreslený vzorek na třídy Tailwind, které můžete zkopírovat do komponent.

CSS

Tailwind v4

Zatím žádný výstup

Vygenerovaný výstup Tailwind se zde objeví automaticky.

Pixel-perfektní převodník Tailwind

Převeďte CSS na čisté třídy Tailwind

Prohlášení-první konverze: Vložte blok deklarace CSS a Tailfind jej použije na ukázkový prvek před převedením vykresleného výsledku na znovu použitelné třídy Tailwind.
Výchozí preference nástroje: Výchozí hodnoty přenosného Tailwind jsou zachovány, když hodnoty deklarace odpovídají měřítku rámce.
Libovolný návrat hodnoty: Jiné než výchozí hodnoty se stanou explicitními libovolnými nástroji, takže vlastní pixely, barvy, stíny a časování lze snadno zkontrolovat.
Výstup bezpečný pro rozložení: Mezery, velikost, zobrazení, mřížka, ohyb, okraje, stíny a typografie jsou mapovány z vykresleného vzorku.
Rychlá extrakce třídy: Výstupem je zaměřený seznam tříd Tailwind, který je připraven ke zkopírování do komponenty, token spike nebo cleanup pass.
Dobré pro audity: Použijte jej k nahrazení jednorázových bloků CSS, inline stylových experimentů a prototypů designového systému přehlednějšími nástroji Tailwind.

Průvodce převodníkem CSS

Převeďte CSS deklarace na třídy Tailwind

Převodník CSS na Tailwind změní blok deklarací na nejbližší přenosné třídy Tailwind. Hodí se pro jednorázové design tokeny, čištění inline stylů a přesun menších CSS úryvků do markup komponent.

Tailfind aplikuje deklarace na ukázkový prvek před převodem, takže hodnoty rozvržení, mezer, barev, ohraničení, stínů, typografie a velikosti jsou interpretovány stejnou cestou vykreslování prohlížeče, kterou používá rozšíření.

Použijte jej k převodu vlastností CSS na třídy Tailwind, ke kontrole, které hodnoty se mapují na výchozí měřítko Tailwind, a k zachování nevýchozích hodnot explicitně jako libovolné nástroje.

Dokáže převést CSS na Tailwind?: Ano. Před exportem nejbližšího seznamu tříd Tailwind vložte blok deklarace CSS a Tailfind jej použije na ukázkový prvek.
Jsou vlastní hodnoty zachovány?: Tailfind mapuje hodnoty na výchozí nástroje Tailwind, když je to možné, a udržuje jiné než výchozí hodnoty viditelné jako libovolné nástroje namísto jejich skrývání.
Mám vložit úplnou šablonu stylů?: Převodník CSS je určen pro deklarační bloky. Převaděč HTML/CSS použijte, když potřebujete selektory, třídy, vnořené značky nebo úplnější šablonu stylů.

Přeskočit ruční převod

Převeďte jakoukoli živou stránku na čistou Tailwind CSS

Tailfind přináší převodník do vašeho prohlížeče, takže můžete zachytit produkční uživatelské rozhraní přímo ze stránky, kterou si prohlížíte.

Více informací

Stáhnout