Bootstrap ile Tailwind Dönüştürücü

Bootstrap 4 veya 5 işaretlemesini yapıştırın, önizlemeyi karşılaştırın ve taşıma ve yeniden oluşturma çalışmaları için Tailwind CSS dışa aktarın.

Bootstrap

Kaynak önizlemesi yok

Bootstrap HTML geçerli olduğunda kaynak önizlemesi görünür.

Tailwind v4

Henüz çıktı yok

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

Tailwind önizleme yok

Oluşturulan Tailwind önizlemesi dönüştürmeden sonra burada görünür.

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

Bootstrap bileşenlerini temiz Tailwind CSS biçimine dönüştürün

Sürüme duyarlı dönüşüm
Bootstrap 4 veya 5 seçin, böylece Tailfind, Tailwind çıktısını oluşturmadan önce doğru kaynak framework varsayımlarını uygular.
Bileşen sınıfı çevirisi
Kartlar, rozetler, uyarılar, düğmeler, formlar, spacing utility’leri ve text utility’leri düz Tailwind CSS biçimine dönüştürülür.
Önizleme destekli temizleme
Kaynak ve oluşturulan önizlemeler, kopyalamadan önce Bootstrap girişini Tailwind çıkışıyla karşılaştırmanıza yardımcı olur.
Izgara ve aralık geçişi
Bootstrap düzen parçaları ve yardımcı program aralığı, ayarlanması daha kolay, okunabilir Tailwind sınıfları haline gelir.
Çıktı SPA için hazır
Sonuç, Tailwind yardımcı programlarına sahip, Angular şablonlarına, React bileşenlerine ve diğer ön uç yığınlarına taşınmaya hazır, düzenli HTML biçimindedir.
Tailwind Play aktarımı
Oluşturulan Tailwind CSS, hızlı düzenlemeler, deneyler ve paylaşım için doğrudan Tailwind Play içinde açılabilir.

Bootstrap geçiş kılavuzu

Bootstrap bileşenlerini Tailwind projelerine taşıma

Bootstrap ile Tailwind dönüştürücü, her component class’ını elle yeniden yazmadan Bootstrap 4 ve Bootstrap 5 markup’ını Tailwind projelerine taşımaya yardımcı olur.

Tailfind, seçilen Bootstrap sürümünü yükler, kaynak bileşenin ön izlemesini yapar ve kartlar, düğmeler, rozetler, formlar, ızgaralar, boşluklar ve tipografi için Tailwind yardımcı programlarıyla normal HTML çıktısını dışa aktarır.

Kendi tasarım sisteminizde iyileştirilebilecek okunabilir bir başlangıç noktası istediğinizde Bootstrap geçiş çalışması, Tailwind yeniden oluşturmaları veya hızlı bileşen çevirisi için bunu kullanın.

Tailfind, Bootstrap 4 ve Bootstrap 5 içeriklerini Tailwind biçimine dönüştürebilir mi?
Evet. Bootstrap 4 veya Bootstrap 5 seçin, işaretlemeyi yapıştırın ve Tailfind, Tailwind CSS dışa aktarmadan önce eşleşen Bootstrap CSS yükler.
Bootstrap kaynağını Tailwind sonucuyla karşılaştırabilir miyim?
Evet. Dönüştürücü bir kaynak önizlemesini ve oluşturulmuş bir Tailwind önizlemesini gösterir, böylece geçiş işi çıktıyı kopyalamadan önce kontrol edilebilir.
Bootstrap çıkışı üretime hazır mı?
Çıktı, geçiş ve yeniden oluşturma çalışmaları için okunabilir bir Tailwind başlangıç noktasıdır. Üretim kullanıcı arayüzünü göndermeden önce kendi tasarım sisteminizde inceleyin.

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

Herhangi bir canlı sayfayı
temiz Tailwind CSS biçimine

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.

Daha fazla bilgi İndir
Uygulama ekran görüntüsü