Bir CSS bildirim bloğu yapıştırın ve oluşturulan örneği, bileşenlere kopyalayabileceğiniz Tailwind sınıflarına dönüştürün.

CSS
Tailwind v4

Henüz çıktı yok

Oluşturulan Tailwind çıktısı burada otomatik olarak görünür.

Piksel hassasiyetinde Tailwind dönüştürücü

CSS'yi temiz Tailwind sınıflarına dönüştürün

Bildirim öncelikli dönüşüm
Bir CSS bildirim bloğu yapıştırın ve Tailfind, oluşturulan sonucu yeniden kullanılabilir Tailwind sınıflarına dönüştürmeden önce bunu bir örnek öğeye uygular.
Varsayılan yardımcı program tercihi
Deklarasyon değerleri framework ölçeğiyle eşleştiğinde taşınabilir Tailwind varsayılanları korunur.
İsteğe bağlı değer geri dönüşü
Varsayılan olmayan değerler açık arbitrary utility’lere dönüşür; böylece özel piksel, renk, gölge ve timing değerleri kolayca incelenir.
Düzen açısından güvenli çıktı
İşlenen örnekten aralık, boyutlandırma, görüntüleme, ızgara, esneklik, kenarlıklar, gölgeler ve tipografi eşlenir.
Hızlı sınıf çıkarma
Çıktı, bir bileşene, token denemesine veya temizleme turuna kopyalanmaya hazır, odaklanmış bir Tailwind sınıf listesidir.
Denetimler için iyi
Tek seferlik CSS bloklarını, satır içi stil deneylerini ve tasarım sistemi prototiplerini daha net Tailwind yardımcı programlarıyla değiştirmek için bunu kullanın.

CSS dönüştürücü kılavuzu

CSS bildirimlerini Tailwind yardımcı programlarına dönüştürün

CSS’den Tailwind’e dönüştürücü, deklarasyon bloğunu en yakın taşınabilir Tailwind utility sınıflarına dönüştürür. Tek seferlik design token’lar, inline style temizliği ve küçük CSS parçalarını component markup’ına taşımak için kullanışlıdır.

Tailfind, bildirimleri dönüştürmeden önce örnek bir öğeye uygular; böylece düzen, aralık, renk, kenarlık, gölge, tipografi ve boyutlandırma değerleri, uzantı tarafından kullanılan aynı tarayıcı oluşturma yolu aracılığıyla yorumlanır.

CSS özelliklerini Tailwind sınıflarına dönüştürmek, hangi değerlerin varsayılan Tailwind ölçeğiyle eşleştiğini kontrol etmek ve varsayılan olmayan değerleri rastgele yardımcı programlar olarak açık tutmak için bunu kullanın.

CSS'yi Tailwind'ye dönüştürebilir mi?
Evet. Bir CSS bildirim bloğu yapıştırın ve Tailfind, en yakın Tailwind sınıf listesini dışa aktarmadan önce bunu bir örnek öğeye uygular.
Özel değerler korunuyor mu?
Tailfind, mümkün olduğunda değerleri varsayılan Tailwind yardımcı programlarıyla eşler ve varsayılan olmayan değerleri gizlemek yerine rastgele yardımcı programlar olarak görünür tutar.
Tam bir stil sayfasını yapıştırmalı mıyım?
CSS dönüştürücü bildirim blokları için tasarlanmıştır. Seçiciler, sınıflar, iç içe işaretleme veya daha kapsamlı bir stil sayfası gerektiğinde HTML/CSS dönüştürücüyü kullanın.

Manuel dönüştürmeyi atlayın

Herhangi bir canlı sayfayı temiz Tailwind CSS'ye dönüştürün

Tailfind, dönüştürücüyü tarayıcınıza getirir, böylece üretim kullanıcı arayüzünü doğrudan görüntülediğiniz sayfadan yakalayabilirsiniz.

Uygulama ekran görüntüsü