הדבק סימון Bootstrap 4 או 5, השווה את התצוגה המקדימה וייצא את Tailwind CSS לעבודות העברה ובנייה מחדש.

Bootstrap

אין תצוגה מקדימה של מקור

תצוגה מקדימה של המקור מופיעה כאשר ה-Bootstrap HTML חוקי.

Tailwind v4

עדיין אין פלט

פלט Tailwind שנוצר מופיע כאן באופן אוטומטי.

אין תצוגה מקדימה של Tailwind

תצוגה מקדימה של Tailwind שנוצרה מופיעה כאן לאחר ההמרה.

ממיר Tailwind מושלם לפיקסלים

המר רכיבי Bootstrap ל-Tailwind CSS נקיים

המרה מודעת לגרסה
בחר Bootstrap 4 או 5 כך ש-Tailfind יחיל את הנחות מסגרת המקור הנכונות לפני יצירת פלט Tailwind.
תרגום מחלקת רכיבים
כרטיסים, תגים, התראות, כפתורים, טפסים, מחלקות spacing ומחלקות text מתורגמים ל-markup רגיל שמוכן ל-Tailwind.
ניקוי מגובה בתצוגה מקדימה
מקור ותצוגות מקדימות שנוצרו עוזרות להשוות את הקלט Bootstrap מול פלט Tailwind לפני ההעתקה.
העברת רשת ומרווחים
שברי פריסת Bootstrap ומרווחים הופכים למחלקות Tailwind קריאות שקל יותר לכוונן.
הפלט מוכן לספא
התוצאה היא HTML רגיל עם מחלקות Tailwind, מוכן לעבור לתבניות Angular, רכיבי React וערימות frontend אחרות.
מסירת Tailwind Play
ה-Tailwind CSS שנוצר יכול להיפתח ישירות ב-Tailwind Play לעריכה, ניסויים ושיתוף מהירים.

מדריך הגירה של Bootstrap

העבר רכיבי Bootstrap לפרויקטים של Tailwind

ממיר Bootstrap ל-Tailwind עוזר להעביר סימון Bootstrap 4 ו-Bootstrap 5 לפרויקטים של Tailwind מבלי לשכתב כל מחלקה של רכיבים ביד.

Tailfind טוען את גרסת Bootstrap שנבחרה, מציג תצוגה מקדימה של רכיב המקור, ומייצא HTML רגיל עם מחלקות Tailwind עבור כרטיסים, כפתורים, תגים, טפסים, רשתות, מרווחים וטיפוגרפיה.

השתמש בו לעבודות הגירה של Bootstrap, בנייה מחדש של Tailwind, או תרגום מהיר של רכיבים כאשר אתה רוצה נקודת התחלה קריאה שניתן לשפר אותה בתוך מערכת העיצוב שלך.

האם Tailfind יכול להמיר את Bootstrap 4 ו-Bootstrap 5 ל-Tailwind?
כֵּן. בחר Bootstrap 4 או Bootstrap 5, הדבק את הסימון ו-Tailfind יטען את Bootstrap CSS התואם לפני ייצוא Tailwind CSS.
האם אוכל להשוות את מקור Bootstrap עם תוצאת Tailwind?
כֵּן. הממיר מציג תצוגה מקדימה של מקור ותצוגה מקדימה של Tailwind שנוצרה כך שניתן לבדוק את עבודת ההגירה לפני העתקת הפלט.
האם פלט Bootstrap מוכן לייצור?
הפלט הוא נקודת התחלה Tailwind הניתנת לקריאה לעבודות הגירה ובנייה מחדש. סקור אותו בתוך מערכת העיצוב שלך לפני שליחת ממשק המשתמש הייצור.

דלג על המרה ידנית

המר כל דף חי ל-Tailwind CSS נקי

Tailfind מביא את הממיר לדפדפן שלך, כך שתוכל ללכוד את ממשק המשתמש הייצור ישירות מהדף שאתה צופה בו.

צילום מסך של אפליקציה