logo
Screen Ruler logo

Screen Rulerحوّل عملية التصميم إلى تجربة مرئية احترافية متكاملة

أداة متقدمة لتحليل التصميم: فحص Flexbox/Grid، استخراج الألوان، محاكاة الحالات، تحويل CSS لـ Tailwind، واختبار SEO والأداء.

Screen Ruler screenshot

المزيد عن Screen Ruler

Screen Ruler - قس وافحص الويب

Screen Ruler هو امتداد قوي لمتصفح Chrome مصمم لمطوري ومصممي الويب الذين يحتاجون إلى دقة مثالية بالبكسل عند فحص المواقع الإلكترونية. قس أي عنصر على الفور، واستخرج خصائص CSS، والتقط لقطات شاشة، وتحقق من تنفيذ التصميم دون مغادرة متصفحك.

أبرز الميزات

  • قياس دقيق بالبكسل: قس أبعاد العناصر والهوامش والحشوات بدقة بكسلية كاملة بمجرد تمرير الماوس فوق المحتوى.
  • استخراج CSS: عرض CSS المحسوب لأي عنصر محدد ونسخه مباشرة إلى الحافظة بنقرة واحدة.
  • أدوات فحص متقدمة: وصول إلى منتقى الألوان، مساطر الصفحة مع خطوط التقاطع، لقطات العناصر، وكشف تباين WCAG.
  • تحديد ذكي: التنقل بين العناصر الأب والأبناء باستخدام اختصارات لوحة المفاتيح البديهية (Alt/Option + أعلى/أسفل).
  • ميزات PRO: فتح المفتش العائم، الوضع المتجاوب، تحليل الحركة، استخراج الموارد، وتراكب شبكة التخطيط بشراء لمرة واحدة.

حالات الاستخدام

  • التحقق من التصميم: يتحقق المصممون من تطابق المواقع المنفذة مع تصاميمهم الأصلية بدقة مثالية.
  • تصحيح أخطاء الواجهة الأمامية: يحدد المطورون بسرعة مشاكل التخطيط، مشاكل المحاذاة، وتناقضات المسافات.
  • تدقيق إمكانية الوصول: كشف تلقائي لأخطاء تباين WCAG مع توصيات قابلة للتنفيذ للتحسين.
  • إدارة الموارد: استخراج الصور وملفات SVG والرسومات المتجهة ولوحات الألوان من أي صفحة ويب لإعادة الاستخدام أو التوثيق.

الجمهور المستهدف

Screen Ruler أداة أساسية لمطوري الويب ومصممي واجهة المستخدم/تجربة المستخدم والمهندسين الأماميين الذين يطلبون الدقة في سير عملهم. كما أنها قيمة لاختباري الجودة، ومتخصصي إمكانية الوصول، وأي شخص مشارك في تنفيذ تصميم الويب وضمان جودته.