ממיר HTML/CSS ל-Tailwind

הדבק את HTML ו-CSS, צפה בתצוגה מקדימה של הפרגמנט המעובד וייצא את Tailwind CSS נקי עבור Tailwind Play או עבור בסיס הקוד שלך.

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

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

Tailwind v4

עדיין אין פלט

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

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

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

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

המר את HTML ו-CSS ל-Tailwind CSS נקי

קורא את HTML ו-CSS ביחד
בוררים, מחלקות, inline styles וכללים מקוננים נפתרים מול ה-markup בפועל לפני יצירת מחלקות Tailwind.
שומר על סימון משמעותי
מבנה סמנטי, תכונות, טקסט, קישורים ורכיבי טופס נשארים ב-HTML המיוצא בזמן שהסגנון עובר לתוכניות שירות.
המרה מגובת תצוגה מקדימה
מקור ותצוגות מקדימות שנוצרו מקלות על השוואה בין הפרגמנט המקורי לפלט Tailwind.
כיסוי אלמנט מקונן
רכיבי צאצא, קבצי SVG, סמלים ושברי ממשק משתמש מורכבים מומרים עם הקשר הסגנון שמסביב.
שימושי עבור בנייה מחדש של רכיבים
העבר קטעי ממשק משתמש מועתקים, אבות טיפוס וקטעים סטטיים לרכיבי Tailwind מבלי לאבד את הצורה המקורית של HTML.
מסירת Tailwind Play
ה-Tailwind CSS שנוצר יכול להיפתח ישירות ב-Tailwind Play לעריכה, ניסויים ושיתוף מהירים.

מדריך לממיר HTML/CSS

המר את HTML ו-CSS ל-Tailwind

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

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

השתמש בו כאשר אתה זקוק להמרה מהירה של HTML ל-Tailwind CSS, העברת Tailwind Play נקייה יותר, או נקודת התחלה לבנייה מחדש של רכיבים סטטיים ב-Angular, React, Vue, Svelte או HTML.

האם Tailfind יכול להמיר את HTML ו-CSS ל-Tailwind CSS?
כֵּן. הדבק מקטע HTML ואת CSS שלו, ו-Tailfind מעבד את התוצאה לפני ייצוא HTML רגיל עם מחלקות עזר Tailwind.
האם הממיר שומר על ערכי CSS מותאמים אישית?
Tailfind מעדיף מחלקות Tailwind ברירת מחדל כשהערכים תואמים לסולם framework, ומשתמש ב-arbitrary values ברורים לצבעים, מרווחים, צללים וגדלים מותאמים אישית.
איזה סוג של HTML עובד הכי טוב?
קטעי ממשק משתמש קטנים ועצמאיים עובדים בצורה הטובה ביותר, כולל כרטיסים, טפסים, קטעים, אבות טיפוס וקטעי קוד מדור קודם שבהם ניתן להדביק את ה-CSS הרלוונטי עם הסימון.

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

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

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

מידע נוסף הורד
צילום מסך של אפליקציה