ארגז הכלים המושלם למפתחים לעיצוב ופיתוח אתרים

64+ כלים חזקים לבדיקה, מדידה, לכידה, ניתוח ועיצוב דפי אינטרנט ישירות בדפדפן שלך.

הכל מועדפים בדיקה לכידה מדידה index.popup_tab_analyse
CSS Inspector
בודק אנימציות
העתק כ-Tailwind
מצב מתאר בלבד
עוזר Tailwind
מתאר דף
מזהה רכיבים
הזז אלמנט
מחק/הסתר אלמנט
ייצא אלמנט
העתק רכיב..
צילום מסך
חילוץ תמונות
SVG Grabber
מחליף תמונות
מחולל QR Code
איך להתחיל

התחל להשתמש ב-DevSuite Pro בכמה לחיצות בלבד

ההתחלה פשוטה. התקן את התוסף, פתח כל דף אינטרנט וגש ל-64+ כלי פיתוח מהחלון הקופץ או מהדוק הצף. אין צורך בהגדרות.

הוסף את התוסף ל-Chrome

  1. פתח את חנות האינטרנט של Chrome וחפש את תוסף "DevSuite Pro".
  2. לחץ על "הוסף ל-Chrome" ואז אשר בלחיצה על "הוסף תוסף" בחלון הקופץ.

פתח כל דף אינטרנט והפעל כלי

  1. נווט לכל אתר, ואז לחץ על סמל DevSuite Pro בסרגל הכלים או השתמש בדוק הצף בדף.
  2. בחר כל כלי מהרשת. כלים כמו CSS Inspector, סרגלים או בורר צבעים מופעלים מיד בדף הנוכחי.
תכונות התוסף

התכונות המרכזיות של DevSuite Pro

DevSuite Pro מציע 64+ כלי פיתוח לבדיקה, מדידה, עיצוב וניתוח דפי אינטרנט. שפר את תהליך העבודה שלך עם תכונות חזקות הבנויות ישירות בדפדפן שלך.

CSS Inspector

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

למידע נוסף →

בודק אלמנטים

לחץ על כל אלמנט כדי לבדוק את המאפיינים, המידות, הריווח, הגופנים והצבעים שלו. הבן את מבנה הדף מיד ללא פתיחת כלי הפיתוח של הדפדפן.

למידע נוסף →

סרגלים ומדריכים

מדוד מרחקים, בדוק יישור והוסף סרגלים ומדריכים מדויקים בפיקסלים על כל דף אינטרנט כדי להבטיח שהעיצובים שלך מיושרים בצורה מושלמת.

למידע נוסף →

בורר צבעים

בחר צבעים מכל אלמנט בדף והעתק ערכי HEX, RGB או HSL ללוח שלך בלחיצה אחת.

למידע נוסף →

לכידת צילום מסך

צלם צילומי מסך של דף שלם או אזור נראה של כל דף אינטרנט והורד אותם מיד, מושלם לשיתוף עיצובים ודיווח על באגים.

למידע נוסף →

בודק תגובתיות

צפה בתצוגה מקדימה של כל דף אינטרנט בגדלי מסך ורזולוציות מכשיר שונים כדי לבדוק עיצוב רספונסיבי מבלי לעזוב את הדפדפן.

למידע נוסף →
חקור כלים נוספים בפירוט:
CSS Inspector חינם

בדוק וערוך סגנונות CSS בזמן אמת

CSS Inspector הוא כלי פיתוח רב עוצמה המאפשר לך לצפות במאפייני ה-CSS המלאים של כל אלמנט פשוט על ידי העברת העכבר מעליו…

בדיקה ושליטה ב-CSS Animations בזמן אמת

Animation Inspector מעניק לך שליטה מלאה על כל CSS animation ו-transition הפועלים בכל דף אינטרנט.

המר CSS של כל אלמנט ל-Tailwind Utility Classes

Copy as Tailwind גושר על הפער בין עיצוב ויזואלי לקוד Tailwind CSS.

הצג את מבנה ה-layout המלא של כל דף

מצב outline בלבד מוסיף מסגרות outline עם קידוד צבעים לכל רכיב HTML בדף אינטרנט, ומעניק לך מבט X-ray מיידי על מבנ�…

קבל classes של Tailwind מקוטלגות לכל רכיב

Tailwind Helper בודק כל רכיב בדף אינטרנט ומייצר פירוט מקיף ומקוטלג של classes של Tailwind CSS utility תואמות. בשונ�…

Page Outliner חינם

תצוגת עץ HTML ויזואלית על כל דף אינטרנט

Page Outliner מציג את מבנה ה-DOM המלא של כל דף אינטרנט כשכבת עץ ויזואלית — ישירות על הדף עצמו. כל אלמנט HTML מקבל תווית…

זהה רכיבי React, Vue, Angular ו-Svelte בכל אתר

Component Detector מזהה אוטומטית איזה framework frontend אתר משתמש בו וחושף את עץ הרכיבים המלא שלו. ראה שמות רכיבי…

Drag & Drop למיקום מחדש של כל אלמנט בדף

הזזת אלמנט מאפשרת לך ללחוץ על כל אלמנט בדף אינטרנט ולגרור אותו פיזית למיקום חדש. בדוק חלופות layout, צור prototype…

הסר או החלף נראות של כל אלמנט

מחיקה/הסתרת אלמנט מאפשרת לך להסיר או להסתיר זמנית כל אלמנט בדף אינטרנט בלחיצה אחת. נקה דפים לצילומי מסך, הסר פרסומות…

ייצא כל אלמנט כ-HTML, CSS, או JSON

ייצוא אלמנט מאפשר לך ללחוץ על כל אלמנט בדף אינטרנט ולייצא את המבנה המלא שלו בשלושה פורמטים: תגיות HTML גולמיות עם כל…

צור רכיבי React, Vue ו-Svelte מכל אלמנט

העתקת קוד רכיב הופכת כל אלמנט בדף אינטרנט לקובץ רכיב נקי ומוכן לייצור עבור הפריימוורק שלך. לחץ על אלמנט וקבל רכיב React…

צלם את האזור הגלוי או את הדף המלא

צילום מסך לוכד תמונות באיכות גבוהה של כל דף אינטרנט בשני מצבים: אזור גלוי (בדיוק מה שאתה רואה בחלון הדפדפן) או דף מלא…

הצג, בחר והורד את כל התמונות מכל דף אינטרנט

חילוץ תמונות סורק כל דף אינטרנט ומציג כל תמונה בגלריה שניתן לעיין בה.

SVG Grabber פרו

מצא, תצוגה מקדימה והורד כל SVG בכל דף

SVG Grabber מאתר כל SVG בדף אינטרנט — אלמנטי SVG מוטבעים, הפניות לקבצי .svg חיצוניים, SVG sprites (תבניות use/symbol)…

החלף כל תמונה בדף עם תמונה משלך

Image Replacer מאפשר לך ללחוץ על כל תמונה בדף אינטרנט ולהחליפה בשלך — על ידי העלאת קובץ מקומי או הדבקת URL של תמונ�…

צור QR Code לכל URL או טקסט באופן מיידי

מחולל QR Code יוצר אוטומטית QR code סריק עבור ה-URL של הדף הנוכחי — או עבור כל URL או טקסט מותאם אישית שתזין. בחר את…

סרגל דף חינם

סרגלים, קווי מנחה ומדידות מדויקות לפיקסל על כל דף

סרגל דף מוסיף סרגלים בסגנון Photoshop וקווי מנחה גררים לכל דף אינטרנט.

תצוגה מקדימה של מספר viewport מכשירים בו-זמנית

Responsive Viewer מציג את דף האינטרנט הנוכחי מרונדר במספר גדלי viewport של מכשירים זה לצד זה — הכל על מסך אחד. ראה כיצד…

Measure Distance חינם

מדוד מרחקים מדויקים ב-pixel בין כל שני אלמנטים

Measure Distance מאפשר ללחוץ על כל שני אלמנטים בדף אינטרנט ולראות מיידית את מרחק ה-pixel המדויק ביניהם — אופקית (X)…

הדמיית כל stacking context ושכבת z-index

בודק ה-Z-Index חושף את סדר הערימה המלא של כל אלמנט בדף האינטרנט.

בחינת פריסות CSS Grid ו-Flexbox עם שכבות-על ויזואליות

ויזואליזר Grid/Flex מזהה כל מיכל CSS Grid ו-Flexbox בדף האינטרנט ומרנדר את מבנה הפריסה שלהם כשכבות-על צבעוניות ישירות…

סימולציית נקודות חמות של תשומת לב משתמשים בכל דף

Heatmap Simulator מייצר heatmap חזוי של תשומת לב לכל דף אינטרנט, על בסיס דפוסי מחקר UX מבוססים — התנהגות קריא�…

ניקוי סלקטיבי של cache, cookies, localStorage ו-sessionStorage

Clear Browsing Data מעניק למפתחים דרך מהירה וסלקטיבית לנקות סוגים ספציפיים של נתוני גלישה עבור האתר הנוכחי — cache…

Site Stack פרו

זיהוי כל טכנולוגיה מאחורי כל אתר

Site Stack סורק כל אתר ומזהה את מחסנית הטכנולוגיה המלאה שלו — frameworks צד לקוח (React, Vue, Angular, Svelte)…

SEO Inspector חינם

ביקורת SEO מקיפה: meta tags, כותרות, OpenGraph ועוד

SEO Inspector מספק ביקורת SEO מיידית ומקיפה של כל דף אינטרנט.

ביקורת WCAG אוטומטית: ניגודיות, alt text, ARIA ועוד

בודק הנגישות מבצע בדיקות WCAG 2.1 Level AA אוטומטיות על כל דף אינטרנט ומפיק דוח מסווג של בעיות נגישות. זהה יחסי…

לחץ על כל טקסט בכל דף כדי לערוך אותו מיידית

עורך הטקסט החי הופך כל אלמנט טקסט בדף אינטרנט לעריך בלחיצה אחת.

החלף כל גופן בצורה גלובלית או לפי אלמנט מתוך Google Fonts

Fonts Changer מאפשר להחליף כל גופן בדף אינטרנט בגופן אחר מספריית Google Fonts — באופן גלובלי (כל הטקסט בדף) או לפי…

גלה כל גופן בשימוש בכל דף אינטרנט

List All Fonts סורק כל דף אינטרנט ומציג מלאי מלא של כל משפחת גופנים בשימוש — גופני אינטרנט הנטענים מ-CDNs, גופנים…

Color Picker חינם

eyedropper מדויק לערכי צבע HEX, RGB ו-HSL

Color Picker מספק כלי eyedropper מדויק ברמת ה-pixel לדגימת צבעים מכל אלמנט בדף אינטרנט — טקסט, רקעים, תמונות…

Color Palette חינם

חלץ את ה-Color Palette המלא מכל דף אינטרנט

Color Palette סורק כל אלמנט בדף אינטרנט וחולץ את מערכת הצבעים המלאה בשימוש — מטקסט ורקעים ועד גבולות, צלליות ומבטאים…

החל dark mode על כל אתר באופן מיידי

כפיית dark mode מיישמת color scheme כהה על כל אתר שאינו מציע כזה — או עוקפת ערכת נושא בהירה של אתר. הכלי הופך בצור�…

הפעל או כבה JavaScript לפי טאב באופן מיידי

Toggle JavaScript משבית או מפעיל מחדש את הרצת JavaScript עבור טאב הדפדפן הנוכחי בלחיצה אחת.

עורך Cookie חינם

צפה, ערוך, הוסף ומחק Cookies לכל domain

Cookie Editor מציג את כל ה-cookies עבור ה-domain הנוכחי בטבלה נקייה וניתנת למיון.

צפה בפלט ה-console בפאנל צף — ללא DevTools

Console Logger לוכד את כל פלט ה-console (console.log, console.warn, console.error, console.info) ומציג אותו בפאנל צף…

נטר את כל בקשות הרשת בזמן אמת

Network Monitor לוכד ומציג כל בקשת רשת שהדף הנוכחי מבצע — קריאות XHR/Fetch API, טעינת סקריפטים, קבצי CSS, הורדת תמונות…

צפה, ערוך, הוסף ומחק ערכי localStorage ו-sessionStorage

Local Storage Editor מספק ממשק טבלה נקי לניהול ערכי localStorage ו-sessionStorage עבור האתר הנוכחי.

סרוק כל קישור בדף ואתר את הקישורים השבורים

בודק קישורים שבורים סורק כל קישור בדף הנוכחי — קישורי עוגן (href), מקורות תמונות, מקורות סקריפטים והפניות לגיליונות…

לוח ביצועים מיידי: זמן טעינה, נתוני DOM ומשאבים

ביצועי דף מספק סקירת ביצועים מיידית של כל דף אינטרנט — מדדי תזמון טעינה (FCP, DOMContentLoaded, טעינה מלאה, TTI), נתוני…

מעצב JSON חינם

עיצוב, כיווץ ואימות JSON בקליק אחד

מעצב JSON מעצב באופן קריא (pretty-prints), מכווץ (minifies) ומאמת JSON ישירות בדפדפן שלך.

קודד מחרוזות אל Base64 ומ-Base64 באופן מיידי

מקודד/פורק Base64 מרה מחרוזות ל-Base64 ו-Base64 חזרה לטקסט ישירות בדפדפן שלך.

קודד & פענוח מחרוזות URL בלחיצה אחת

מקודד/פורק URL מומיר מחרוזות URL מ וחזרה לצורה המקודדת באחוז שלהם.

קודד & פענוח ישויות HTML באופן מיידי

מקודד ישות HTML מומיר תווים מיוחדים (< > & " ') לשקולים ישות HTML שלהם (&lt; &gt; &amp; &quot; &#39;) ובחזרה. חיוני…

בריחה & ביטול בריחה של מחרוזות לקוד

בריחת קו נטוי/ביטול בריחה מומיר מחרוזות מ וחזרה לצורה נברחת שלהם (\n \t \r \" \' \\ ובריחות Unicode). חיוני בעת הטבעת…

64 תמונה ↔ Base64 חינם

המר תמונות אל Base64 Data URIs ומ-

תמונה ↔ Base64 מומיר קבצי תמונה (PNG, JPG, SVG, WebP, GIF) ל-Base64 קידוד נתונים URIs והחזרה.

מנפה JWT חינם

פענוח אסימוני Web JSON באופן מיידי

מנפה JWT מפענח ובוחן אסימוני Web JSON — ניתוח כותרת, עומס וחתימה, הצגת תביעות וסימון סטטוס תוקף. מושלם לניפוי שגיאות של…

מייצר UUID חינם

צור מזהי UUID v4 בתפזורת

מייצר UUID מייצר מזהי UUID v4 חזקים מבחינה קריפטוגרפית באמצעות API קריפטו של הדפדפן.

מייצר Hash חינם

חישוב MD5, SHA-1, SHA-256, SHA-384, SHA-512 Hashes

מייצר Hash מחשב גיבולים קריפטוגרפיים (MD5, SHA-1, SHA-256, SHA-384, SHA-512) של כל קלט טקסט.

צור סיסמאות חזקות קריפטוגרפית

מייצר סיסמה מייצר סיסמאות חזקות ואקראיות באמצעות ממשק API של אקראיות קריפטוגרפית של הדפדפן. קונפיגורציה אורך (8-128)…

בוחן Regex חינם

בדוק ביטויים קבועים בחיים עם הדגשת התאמה

בוחן Regex מעריך ביטויים קבועים מול טקסט בדיקה בזמן אמת.

המר Unix, ISO וניתוח קריא בדוקי

ממיר חותמת זמן מתרגם בין חותמות זמן Unix (שניות, אלפיות שניה, מיקרו שניות, ננו שניות), ISO 8601, RFC 2822 ופורמטים…

השוואת שני גושי טקסט שורה אחר שורה

כלי ההשוואה בודק שני גושי טקסט ומדגיש שורות שנוספו, הוסרו וללא שינוי, עם פלט מקודד בצבע. מציע תצוגה מאוחדת (בסגנון Git)…

בדוק יחס ניגודיות WCAG של כל שני צבעים

בודק הניגודיות מחשב את יחס הניגודיות לפי תקן WCAG 2.1 בין שני צבעים ומדרג אותם מול ספי AA/AAA עבור טקסט רגיל וגדול…

המרת צבעי HEX, RGB, HSL, HSV ו-OKLCH באופן מיידי

ממיר פורמט צבעים מתרגם כל צבע בין HEX, RGB, HSL, HSV ו-OKLCH.

חילוץ הפלטה הדומיננטית מכל תמונה

מחלץ צבעים מתמונה מנתח כל קובץ תמונה (בגרירה, הדבקה או לחיצה לטעינה) ומחזיר עד 16 צבעים דומיננטיים עם משקלים באחוזים…

קבל בוררי CSS ו-XPath לכל אלמנט

מוצא נתיבי DOM (DOM Path Finder) מאפשר לך לרחף מעל כל אלמנט בדף כדי לחשוף את בורר ה-CSS הייחודי שלו, בורר קצר, XPath…

בודק CORS חינם

בדיקת בקשות Cross-Origin ובדיקת כותרות CORS

בודק CORS בודק אם בקשת cross-origin מהאתר שלך תאושר על ידי שרת היעד.

לכידת פריימים (Frames) של WebSocket בזמן אמת

מפקח WebSocket לוכד כל פריים של WebSocket - נשלח והתקבל - בכל החיבורים בדף.

סרוק את הדף לאיתור תמונות שבורות באופן מיידי

מאתר התמונות השבורות סורק כל <img> ותמונת רקע CSS (background-image) בדף, מזהה טעינות שנכשלו (שגיאות 404, תקלות CORS…

מילוי אוטומטי של טפסים עם נתוני בדיקה מציאותיים

ממלא הטפסים (Form Filler) מאכלס כל שדה טופס גלוי בדף בנתוני בדיקה מציאותיים - שם, אימייל, טלפון, כתובת, סיסמה וכו'…

המר בין CSV ו-JSON לכל כיוון

ממיר ה-CSV ↔ JSON מטפל במחזור ההמרה המלא בין שני הפורמטים הטבלאיים הנפוצים ביותר.

מעצב XML חינם

עיצוב, אימות והצגת XML עם הדגשת תחביר

מעצב ה-XML (XML Formatter) מעצב יפה (pretty-prints), מצמצם (minifies) ומאמת XML בתוך הדפדפן.

מעצב SQL חינם

עיצוב וסידור שאילתות SQL יפות

מעצב ה-SQL (SQL Formatter) הופך SQL מצומצם או מבולגן לשאילתות קריאות ומוזחות.

המרה ל-PDF חינם

שמירת דפי אינטרנט כ-PDFים נקיים

המרה ל-PDF שומרת את דף האינטרנט הנוכחי כ-PDF דרך תיבת הדפוס של הדפדפן, עם סגנונות מודפסים המופעלים תחילה. מסתיר�…

תמחור ותוכניות

תמחור פשוט ושקוף

בחר את התוכנית שמתאימה לתהליך העבודה שלך. התחל בחינם, שדרג בכל עת.

בסיסי

מושלם לניסיון של DevSuite Pro. אין צורך בכרטיס אשראי.

$0

חינם לתמיד
התחל בחינם
  • 43 כלי פיתוח חינמיים
  • CSS Inspector ובורר צבעים
  • לכידת צילום מסך
  • ממשק דוק צף
  • כל עדכוני העתיד בחינם

חודשי הכי פופולרי

גישה מלאה לכל 64+ הכלים המקצועיים. חיוב חודשי.

$2.99

לחודש
התחל תוכנית חודשית
  • כל 64+ כלי הפיתוח
  • גישה מלאה לכלי Pro
  • עד 3 מכשירים
  • תמיכה בעדיפות
  • בטל בכל עת

חד פעמי הערך הטוב ביותר

שלם פעם אחת, השתמש לנצח. גישה מלאה לכל 64+ כלי הפרו ללא חיובים חוזרים.

$29.99

תשלום חד פעמי
קנה פעם אחת, השתמש לנצח
  • כל 64+ כלי הפיתוח
  • גישה מלאה לכלי Pro
  • עד 3 מכשירים
  • תמיכה בעדיפות
  • ללא חיובים חוזרים
DevSuite Pro FAQ section background
שאלות נפוצות

שאלות נפוצות של משתמשי DevSuite Pro

שאלות נפוצות על תכונות ושימוש בתוסף DevSuite Pro. אם יש לך שאלה, ייתכן שהתשובה כבר מופיעה למטה.

איך מתקינים את DevSuite Pro?

בקר בחנות האינטרנט של Chrome, חפש "DevSuite Pro", לחץ על "הוסף ל-Chrome" ואשר בבחירת "הוסף תוסף". לאחר ההתקנה, סמל התוסף יופיע בסרגל הכלים של הדפדפן. לחץ עליו כדי לגשת מיד ל-64+ כלי פיתוח.

מה ההבדל בין כלים חינמיים לכלי Pro?

כלים חינמיים (43+) זמינים לכולם ללא צורך ברישיון. כלי Pro מסומנים בתג PRO זהב ודורשים רישיון Pro פעיל לשימוש. ניתן לראות אילו כלים חינמיים או Pro מהחלון הקופץ — לכלים חינמיים אין סמל מנעול, בעוד שכלי Pro מופיעים מעט עמומים עד שתפעיל את הרישיון שלך.

למה כלי מסוים לא עובד באתרים מסוימים?

לחלק מהאתרים יש מדיניות אבטחת תוכן (CSP) מחמירה שחוסמת פעולות מסוימות של תוספי דפדפן. זה נפוץ במיוחד באתרי בנקים ואתרים ממשלתיים. בנוסף, דפים פנימיים של Chrome (chrome://) אינם מאפשרים לתוספים להריץ סקריפטי תוכן.

האם השינויים שלי בדף הם קבועים?

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

איך מפעילים את רישיון ה-Pro?

פתח את החלון הקופץ של DevSuite Pro, לחץ על סמל ההגדרות בפינה הימנית העליונה. גלול למטה לחלק הרישיון, הדבק את מפתח הרישיון שלך בשדה הקלט ולחץ על הפעל. אם המפתח תקף, התג ישתנה מ-FREE ל-PRO וכל כלי ה-Pro ייפתחו מיד.

איך להזיז או להסתיר את הדוק הצף?

ניתן להזיז את הדוק על ידי כניסה להגדרות ובחירת מיקום סרגל צד אחר — עליון, תחתון, שמאלי או ימני. ניתן גם להסתיר את הדוק לחלוטין על ידי כיבוי "הצג דוק בדפים" בהגדרות, או לחיצה על Ctrl+Shift+X בכל עת.

האם DevSuite Pro אוסף נתוני גלישה?

לא. DevSuite Pro אינו אוסף, עוקב או משדר את נתוני הגלישה שלך. כל ההגדרות מאוחסנות מקומית בדפדפן שלך. הבקשה החיצונית היחידה שנעשית היא בעת הפעלת מפתח הרישיון לאימות המפתח שלך מול השרת שלנו.

האם אפשר להשתמש ב-DevSuite Pro ב-Firefox?

כן! DevSuite Pro זמין גם בחנות האינטרנט של Chrome וגם בתוספי Firefox. הוא עובד על Chrome, Edge, Brave ודפדפנים אחרים מבוססי Chromium, וכן על Firefox.