أضف الامتداد إلى Chrome
- افتح سوق Chrome الإلكتروني وابحث عن امتداد "DevSuite Pro".
- انقر على "إضافة إلى Chrome"، ثم قم بالتأكيد بالنقر على "إضافة الامتداد" في النافذة المنبثقة.
أكثر من 64 أداة قوية لفحص وقياس والتقاط وتحليل وتصميم صفحات الويب مباشرة في متصفحك.
البدء بسيط. قم بتثبيت الامتداد، وافتح أي صفحة ويب، وقم بالوصول إلى أكثر من 64 أداة للمطورين من النافذة المنبثقة أو اللوحة العائمة. لا حاجة للإعدادات.
يوفر DevSuite Pro أكثر من 64 أداة للمطورين لفحص صفحات الويب وقياسها وتصميمها وتحليلها. سرع سير عملك مع الميزات القوية المدمجة مباشرة في متصفحك.
قم بتمرير الماوس فوق أي عنصر لرؤية أنماط CSS الخاصة به فوراً وتحريرها مباشرة، مما يجعل تصحيح وضبط التصاميم في الوقت الفعلي أمراً سهلاً.
تعرف على المزيد →انقر على أي عنصر لفحص خصائصه وأبعاده والمساحات والخطوط والألوان. افهم هيكل الصفحة فوراً دون فتح أدوات المطور للمتصفح.
تعرف على المزيد →قم بقياس المسافات، والتحقق من المحاذاة، وإضافة مساطر وأدلة دقيقة بالبكسل إلى أي صفحة ويب لضمان محاذاة تصميمك بشكل مثالي.
تعرف على المزيد →التقط الألوان من أي عنصر في الصفحة وانسخ قيم HEX أو RGB أو HSL إلى حافظتك بنقرة واحدة.
تعرف على المزيد →التقط لقطات شاشة لكامل الصفحة أو المنطقة الظاهرة في أي صفحة ويب وقم بتنزيلها فورا - مثالي لمشاركة التصاميم والإبلاغ عن الأخطاء.
تعرف على المزيد →قم بمعاينة صفحة الويب بأحجام شاشات ودقة أجهزة مختلفة لاختبار التصميم المستجيب دون مغادرة المتصفح.
تعرف على المزيد →فحص وتحرير أنماط CSS مباشرة
أداة CSS Inspector هي أداة قوية للمطورين تتيح لك رؤية جميع خصائص CSS لأي عنصر بمجرد تمرير الماوس فوقه. انقر لقفل…
تصحيح والتحكم في الرسوم المتحركة CSS في الوقت الفعلي
يمنحك مفتش الرسوم المتحركة تحكمًا كاملاً في كل رسم متحرك وانتقال CSS يعمل على أي صفحة ويب. يمكنك إيقاف جميع الرسوم…
تحويل CSS لأي عنصر إلى فئات Tailwind Utility
يقوم خيار "النسخ كـ Tailwind" بجسر الفجوة بين التصميم المرئي وكود Tailwind CSS.
تصور البنية التخطيطية الكاملة لأي صفحة
يضيف "وضع المخطط التفصيلي فقط" حدودًا خارجية مرمزة لونيًا لكل عنصر HTML في صفحة الويب، مما يمنحك عرضًا بأشعة X لبنية…
احصل على فئات Tailwind مصنفة لأي عنصر
يقوم "مساعد Tailwind" بفحص أي عنصر في صفحة الويب ويُنشئ تحليلاً شاملاً ومصنفًا لفئات خدمات Tailwind CSS المتطابقة. على…
عرض مرئي لشجرة HTML على أي صفحة ويب
يقوم "مخطط الصفحة" بعرض بنية شجرة المعالجة (DOM) الكاملة لأي صفحة ويب كطبقة شجرة مرئية — مباشرة على الصفحة نفسها. يحصل…
اكتشاف مكونات React، Vue، Angular و Svelte على أي موقع
يقوم "كاشف المكونات" بالتعرف التلقائي على إطار عمل الواجهة الأمامية المستخدم في موقع الويب ويكشف عن شجرة مكوناته…
قُم بالسحب والإفلات لتغيير موضع أي عنصر في الصفحة
تتيح لك ميزة "تحريك العنصر" النقر فوق أي عنصر في صفحة الويب وسحبه فعليًا إلى موضع جديد. اختبر بدائل التخطيط، أو النماذج…
قم بإزالة أو تبديل رؤية أي عنصر
تتيح لك ميزة إخفاء/حذف العنصر إزالة أو إخفاء أي عنصر مؤقتًا في صفحة ويب بنقرة واحدة. قم بتنظيف الصفحات للحصول على لقطات…
تصدير أي عنصر كـ HTML أو CSS أو JSON
تتيح لك أداة "تصدير العنصر" النقر فوق أي كائن على صفحة ويب واستخراج بنيته الهيكلية الكاملة بثلاثة تنسيقات: علامات HTML…
قم بإنشاء مكونات React و Vue و Svelte من أي عنصر
تعمل أداة "نسخ كود المكون" على تحويل أي عنصر في صفحة الويب إلى ملف مكون نظيف وجاهز للإنتاج لإطار العمل الذي اخترته…
التقاط لقطات شاشة للمنطقة المرئية أو الصفحة بأكملها
تلتقط أداة لقطة الشاشة صوراً عالية الجودة لأي صفحة ويب في وضعين: المنطقة المرئية (ما تراه تحديداً في نافذة المتصفح) أو…
عرض، تحديد وتنزيل جميع الصور من أي صفحة ويب
تقوم أداة استخراج الصور بمسح أي صفحة ويب وتقديم كل صورة في معرض قابل للتصفح.
بحث، معاينة وتنزيل كل SVG في أي صفحة
يكتشف "التقاط SVG" جميع ملفات SVG بصيغها المختلفة على صفحة الويب — عناصر SVG المضمنة، مراجع ملفات svg. الخارجية، نقوش…
استبدل أي صورة في صفحة الويب بصورتك الخاصة
يتيح لك مستبدل الصور النقر على أي صورة في صفحة الويب واستبدالها بصورة خاصة بك — إما عن طريق رفع ملف محلي أو لصق عنوان…
إنشاء رموز QR لأي رابط موقع (URL) أو نص فوراً
يقوم صانع رمز الاستجابة السريعة (QR Code) بإنشاء رمز QR قابل للمسح لرابط الصفحة الحالية تلقائياً — أو لأي رابط مُخصص أو…
مساطر وأدلة قياس دقيقة بالبكسل في أي صفحة
تضيف مسطرة الصفحة مساطر بأسلوب فوتوشوب وخطوط توجيه قابلة للسحب إلى أي صفحة ويب. تمتد مساطر دقيقة بالبكسل على طول الحواف…
معاينة إطارات عرض الأجهزة المتعددة في نفس الوقت
يعرض العارض المتجاوب صفحة الويب الحالية معروضة بأحجام إطارات عرض أجهزة متعددة جنبًا إلى جنب — كل ذلك على شاشة واحدة…
قياس مسافات دقيقة بالبكسل بين أي عنصرين
تتيح لك أداة قياس المسافة النقر فوق أي عنصرين على صفحة الويب ورؤية المسافة الدقيقة بينهما بالبكسل على الفور — أفقيًا…
تصور بصري لكل تسلسل التكديس ومستويات Z-Index
يكشف مفتش الفهرس الترتيب الكامل لتكديس العناصر على صفحة الويب.
فحص تخطيطات CSS Grid المستجيبة والـ Flexbox بتراكيب مرئية
يتتبع مصور الشبكات والحاويات المرنة (Grid/Flex) أثر وتكوين كل حاويات الشبكة والمرنة من CSS داخل موقعك ويرسم هيكل…
محاكاة بؤر انتباه المستخدمين الافتراضية على أي صفحة
يقوم محاكي الخريطة الحرارية بإنشاء خريطة حرارية لتوقع مناطق انتباه المستخدمين لأي صفحة بناءً على أنماط أبحاث تجربة…
مسح منظم ومحدد لملفات الذاكرة المؤقتة وملفات الارتباط ومساحات التخزين المحلية
يمنح خيار مسح بيانات التصفح مطوري الويب مساراً دقيقاً ومحدداً لمسح وسائط تصفح حصرية تخص مسار الويب النشط — سواء الكاش…
اكتشف كافة التقنيات المخبأة خلف أي صفحة ويب
يمسح مُكتشف التقنيات (Site Stack) الويب ويحلل طبقات الحزمة التكنولوجية المُشَغِلة للموقع بتمامها — منصات الواجهات مثل…
تدقيق شامل لمحركات البحث SEO: الوسوم، العناوين التراتبية الدلالية، وأوسمة المشاركة
يقدم مفتش الـ SEO تقريراً ومراجعة إحصائية فورية لأي موقع ويب.
تدقيق آلي لمعايير WCAG: التباين، النص البديل، خصائص ARIA وأكثر
يقوم مفتش سهولة الوصول بإجراء فحوصات آلية متوافقة مع معايير WCAG 2.1 المستوى AA على أي صفحة ويب وينتج تقريرًا مصنفًا…
انقر على أي نص في أي صفحة لتعديله على الفور
يجعل محرر النصوص المباشر كل عنصر نصي على صفحة الويب قابلاً للتحرير بنقرة واحدة فقط. غيّر العناوين الرئيسية والفقرات…
استبدل أي خط بآخر من Google Fonts لكامل الصفحة أو لعنصر محدد
يتيح لك مُغَيِّر الخطوط استبدال أي خط على صفحة الويب بآخر مختلف من مكتبة خطوط Google — سواء كان ذلك بصفة عامة لكامل…
اكتشف كل خط مستخدم على أي صفحة ويب
يقوم مُسجِّل الخطوط بمسح أي صفحة ويب ويقدم جرداً كاملاً لكل عائلة خطوط مستخدمة — الخطوط المحملة من شبكات CDN، الخطوط…
أداة قطارة دقيقة لالتقاط قيم ألوان HEX، RGB، و HSL بدقة بكسلات مُكبرة
يقدم منتقي الألوان أداة قطارة دقيقة بالبكسل لاقتطاف الألوان من أي عنصر على صفحة الويب — كنص، خلفيات، صور، تدرجات، أو أي…
استخرج لوحة الألوان الكاملة من أي صفحة ويب
تقوم أداة لوحة الألوان بمسح كل عنصر على صفحة الويب واستخراج المجموعة الكاملة من الألوان المستخدمة — بداية من النصوص…
تطبيق الوضع الليلي (المظلم) على أي موقع ويب في لحظات
يطبق نظام فرض الوضع الليلي نظام ألوان داكناً على أي موقع ويب لا يوفر هذا الخيار — أو يتجاوز المظهر الفاتح للموقع. تعمل…
تمكين أو تعطيل JavaScript فوراً وبشكل مستقل لكل علامة تبويب
تعمل أداة تبديل حالة JavaScript على تعطيل أو إعادة تمكين تنفيذ كود الـ JavaScript لعلامة تبويب المتصفح الحالية بنقرة…
عرض، وتعديل، وإضافة، وحذف ملفات تعريف الارتباط لأي نطاق
يعرض محرر ملفات الـ Cookie جميع ملفات تعريف الارتباط للنطاق الحالي في جدول نظيف وقابل للفرز. اطلع على أسماء الملفات،…
عرض مخرجات وحدة التحكم في لوحة عائمة — بدون أدوات المطور (DevTools)
يلتقط مُسجل وحدة التحكم كافة مخرجات (Console) من (console.log و warn و error و info) ويعرضها في لوحة عائمة مباشرة على…
مراقبة كافة طلبات وعمليات الشبكة في الوقت الفعلي
يلتقط مراقب الشبكة كافة الطلبات التي تنفذها الصفحة الحالية ويعرضها — سواء مكالمات واجهة التطبيقات (XHR/Fetch)، أو تحميل…
عرض وتعديل وإضافة وحذف localStorage و sessionStorage
يوفر (محرر التخزين المحلي) واجهة جدول نظيفة لإدارة كل من إدخالات وسجلات المساحة المحلية (localStorage) وتخزين الجلسات…
فحص وتقصي كل رابط على الصفحة واصطياد المكسور منها
يقوم (مدقق ومفتش الروابط) بمسح ضوئي لكل رابط نصي ومسار مدرج في الصفحة الحالية — من روابط نصية (anchor hrefs)، ومصادر…
لوحة معلومات الأداء الفورية: وقت التحميل، وإحصاءات DOM، والموارد
توفر (أداء الصفحة) نظرة عامة وفورية لأداء أي صفحة ويب — كمقاييس توقيت التحميل (FCP، و DOMContentLoaded، والتحميل…
تنسيق وتصغير والتحقق من صحة JSON بضغطة واحدة
يقوم منسق JSON بتنسيق وتصغير والتحقق من صحة JSON مباشرة في متصفحك.
تشفير وفك تشفير السلاسل النصية من وإلى Base64 فوراً
يقوم مشفر / فك تشفير Base64 بتحويل النص إلى Base64 والعكس مباشرة في متصفحك.
تشفير وفك تشفير سلاسل URL بضغطة واحدة
يقوم مشفر / فك تشفير URL بتحويل سلاسل URL من وإلى نموذج التشفير بالنسبة المئوية.
تشفير وفك تشفير كيانات HTML فوراً
يقوم مشفر كيانات HTML بتحويل الأحرف الخاصة (< > & " ') إلى ما يعادلها من كيانات HTML (< > & " ')…
هروب وفك هروب السلاسل النصية للكود
يقوم هروب / فك هروب الشرطة المائلة العكسية بتحويل السلاسل النصية من وإلى شكلها المهروب (\n \t \r \" \' \\ وهروب…
تحويل الصور من وإلى عناوين URL للبيانات بتنسيق Base64
تقوم أداة صورة ↔ Base64 بتحويل ملفات الصور (PNG, JPG, SVG, WebP, GIF) إلى عناوين URL للبيانات مشفرة بـ Base64…
فك تشفير رموز JSON الويب (JWT) فوراً
يقوم مصحح JWT بفك تشفير وفحص رموز JSON الويب - من خلال تحليل الرأس والحمولة والتوقيع، وعرض المطالبات، وتحديد حالة…
توليد معرفات UUID v4 بكميات كبيرة
يقوم مولد UUID بتوليد معرفات UUID v4 قوية تشفيرياً باستخدام واجهة برمجة تطبيقات التشفير (crypto API) الخاصة بالمتصفح…
حساب قيم هاش MD5، SHA-1، SHA-256، SHA-384، SHA-512
يقوم مولد الهاش بحساب قيم الهاش التشفيرية (MD5، SHA-1، SHA-256، SHA-384، SHA-512) لأي نص مدخل. تعمل جميع الخوارزميات…
توليد كلمات مرور قوية تشفيرياً
يقوم مولد كلمات المرور بإنتاج كلمات مرور قوية وعشوائية باستخدام واجهة برمجة تطبيقات العشوائية التشفيرية في المتصفح…
اختبار التعبيرات النمطية مباشرة مع تمييز التطابقات
يقوم مختبر Regex بتقييم التعبيرات النمطية مقابل نص الاختبار في الوقت الفعلي.
تحويل تواريخ Unix و ISO والتواريخ القابلة للقراءة
يقوم محول الطوابع الزمنية بالتحويل بين طوابع Unix الزمنية (بالثواني، والميلي ثانية، والميكرو ثانية، والنانو ثانية)،…
مقارنة كتلتين من النص سطراً بسطر
تقوم أداة المقارنة بمقارنة كتلتين من النص وتمييز الأسطر المضافة، والمحذوفة، وغير المتغيرة بمخرجات مرمزة بالألوان. تتوفر…
التحقق من نسبة تباين WCAG لأي لونين
يقوم فاحص التباين بحساب نسبة تباين الألوان وفقاً لمعايير WCAG 2.1 بين لونين وتصنيفهما بناءً على عتبات AA/AAA لكل من…
تحويل HEX و RGB و HSL و HSV و OKLCH فوراً
يقوم محول تنسيقات الألوان بتحويل أي لون بين HEX و RGB و HSL و HSV و OKLCH.
استخراج لوحة الألوان السائدة من أي صورة
يقوم مستخرج ألوان الصور بتحليل أي ملف صورة (عن طريق السحب، أو اللصق، أو النقر للتحميل) ويعيد ما يصل إلى 16 لوناً سائداً…
الحصول على محددات CSS و XPath لأي عنصر
يتيح لك مستخرج مسارات DOM التحويم فوق أي عنصر في الصفحة للكشف عن محدد CSS الفريد الخاص به، والمحدد القصير، و XPath،…
اختبار طلبات النطاقات المتقاطعة وفحص ترويسات CORS
يختبر فاحص CORS ما إذا كان سيسمح الخادم المستهدف بطلب نطاق متقاطع من موقعك.
التقاط إطارات WebSocket في الوقت الفعلي
يقوم مفتش WebSocket بالتقاط كل إطار WebSocket - المرسل والمستقبل - عبر جميع الاتصالات في الصفحة. يعرض دورة حياة الاتصال…
مسح الصفحة بحثاً عن الصور المعطلة فوراً
يقوم مكتشف الصور المعطلة بمسح كل وسم <img> وصورة خلفية CSS في الصفحة، ويكتشف عمليات التحميل الفاشلة (404، فشل CORS،…
تعبئة النماذج تلقائياً ببيانات اختبار واقعية
يقوم معبئ النماذج بملء كل حقل نموذج مرئي في الصفحة ببيانات اختبار واقعية - الاسم، البريد الإلكتروني، الهاتف، العنوان،…
التحويل بين CSV و JSON في كلا الاتجاهين
يتعامل محول CSV ↔ JSON مع الرحلة الكاملة بين أكثر تنسيقي بيانات جدولية شيوعاً.
تنسيق والتحقق من صحة وعرض XML مع تمييز الصيغة
يقوم منسق XML بتنسيق وتصغير والتحقق من صحة XML داخل المتصفح.
تجميل وتنسيق استعلامات SQL
يقوم منسق SQL بتحويل أكواد SQL المصغرة أو الفوضوية إلى استعلامات مقروءة ومنسقة بمسافات بادئة. توضع الكلمات المفتاحية في…
حفظ صفحات الويب كملفات PDF نظيفة
يقوم خيار التحويل إلى PDF بحفظ صفحة الويب الحالية كملف PDF عبر حوار الطباعة الخاص بالمتصفح، مع تطبيق أنماط مناسبة…
اختر أفضل خطة لسير عملك. ابدأ مجاناً، وقم بالترقية في أي وقت.
أسئلة شائعة حول ميزات واستخدام امتداد DevSuite Pro. إذا كان لديك سؤال، فقد تجد الإجابة أدناه.
قم بزيارة سوق Chrome الإلكتروني، وابحث عن "DevSuite Pro"، وانقر فوق "إضافة إلى Chrome" وأكد باختيار "إضافة الامتداد". بمجرد التثبيت، ستظهر أيقونة الامتداد في شريط أدوات المتصفح. انقر عليها للوصول إلى أكثر من 64 أداة للمطورين فوراً.
الأدوات المجانية (43+) متاحة للجميع بدون ترخيص. أدوات برو تحمل شارة PRO ذهبية وتتطلب ترخيص برو نشط لاستخدامها. يمكنك معرفة الأدوات المجانية أو البرو في النافذة المنبثقة - الأدوات المجانية لا تحتوي على أيقونة قفل، بينما ستبدو أدوات برو باهتة قليلاً حتى تقوم بتفعيل ترخيصك.
تحتوي بعض مواقع الويب على سياسات أمان محتوى صارمة (CSP) تمنع بعض إجراءات امتدادات المتصفح. هذا أمر شائع بشكل خاص في المواقع المصرفية والحكومية. بالإضافة إلى ذلك، لا تسمح صفحات Chrome الداخلية (chrome://) للامتدادات بتشغيل نصوص برمجية للمحتوى.
لا. جميع التغييرات التي يتم إجراؤها بواسطة أدوات مثل تحريك العنصر ومحرر النصوص المباشر وحذف/إخفاء العنصر و CSS Inspector هي تغييرات مؤقتة. إنها تؤثر فقط على ما تراه في متصفحك في هذه اللحظة. سيؤدي تحديث الصفحة إلى إعادة كل شيء لحالته الأصلية.
افتح نافذة DevSuite Pro المنبثقة، وانقر على أيقونة الإعدادات في الزاوية العلوية اليمنى. انتقل لأسفل إلى قسم الترخيص، ثم الصق مفتاح الترخيص الخاص بك في حقل الإدخال وانقر فوق تفعيل. إذا كان المفتاح صالحاً، فستتغير الشارة من مجاني إلى برو، وسيتم فتح جميع أدوات برو فورا.
يمكنك تحريك اللوحة من خلال الذهاب إلى الإعدادات واختيار موقع شريط جانبي مختلف - أعلى، أسفل، يسار، أو يمين. يمكنك أيضاً إخفاء اللوحة تماماً عن طريق إيقاف تشغيل مفتاح "إظهار اللوحة في الصفحات" في الإعدادات، أو بالضغط على Ctrl+Shift+X في أي وقت.
لا. لا يجمع DevSuite Pro أو يتتبع أو يرسل أي من بيانات التصفح الخاصة بك. يتم تخزين جميع الإعدادات محلياً في متصفحك. يتم إرسال الطلب الخارجي الوحيد أثناء تفعيل مفتاح الترخيص للتحقق من مفتاحك مع خادمنا.
نعم! DevSuite Pro متاح في كل من سوق Chrome الإلكتروني وإضافات Firefox. وهو يعمل على Chrome و Edge و Brave والمتصفحات الأخرى القائمة على Chromium، وكذلك على Firefox.