CSSLab — أدوات التصميم و CSS
مولّدات بصرية لأعمال الواجهات اليومية: أنشئ التدرجات بمعاينة مباشرة وولّد حزم Favicon كاملة — مباشرة في متصفحك.
100% داخل متصفحك مجاني للأبد بدون تسجيل
يعمل 100% داخل متصفحك — لا يتم رفع أي شيء أبداً.
كل أدوات CSSLab
تدرجات CSS صمّم تدرجات خطية ودائرية ومخروطية بنقاط ألوان قابلة للسحب ومعاينة مباشرة — ثم انسخ كود CSS نظيفاً وجاهزاً للاستخدام. مولّد Favicon ارفع صورة واحدة وحمّل حزمة Favicon كاملة: favicon.ico وصور PNG من 16 إلى 512 بكسل وأيقونة Apple touch و webmanifest ووسوم HTML الجاهزة للصق. اختيار لون اختيار بصري للألوان مع أكواد HEX / RGB / HSL فورية. التباين اختبر أي زوج من الألوان مقابل عتبات AA وAAA. اللوحات لوحات متناغمة من أي لون أساسي — مع متغيرات CSS. الظلال اصنع ظل CSS المثالي بمنزلقات ومعاينة حية. Flexbox عدّل خصائص Flexbox بصرياً وانسخ الـ CSS. Grid صمّم الشبكات بصرياً — واحصل على CSS نظيف فوراً. SVG قلّص حجم SVG بأمان — الشكل النهائي لا يتغير. نسبة الأبعاد احسب أي عرض/ارتفاع من نسبة مستهدفة فوراً. مولد Border Radius من زوايا بسيطة إلى أشكال blob عضوية بالسحب. مولد أنيميشن CSS أنيميشن keyframes احترافي بدون كتابة كود يدوي. تحويل CSS إلى Tailwind من خصائص CSS إلى utility classes بلصقة واحدة. محاكاة عمى الألوان شاهد تصميمك بعيون المصابين بعمى الألوان. خصوصية CSS أي selector يفوز؟ اعرف درجة (a,b,c). محرّر مسارات SVG شاهد وافهم وعدّل مسارات SVG. صور Placeholder صور تجريبية بأي مقاس PNG أو SVG.
الأسئلة الشائعة
هل تُرفع صوري عند إنشاء Favicon؟
لا. مولّد الـFavicon يغيّر حجم صورتك بواجهة canvas بالكامل في متصفحك ويجمع النتائج في ملف ZIP محلياً. تصميمك لا يغادر جهازك أبداً.
هل كود CSS الناتج جاهز للإنتاج؟
نعم — مولّد التدرجات ينتج CSS قياسياً حديثاً يعمل في كل المتصفحات الحالية، جاهزاً للصق في ملف التنسيق مباشرة.
ما مقاسات الـFavicon التي أحصل عليها؟
الطقم الحديث الكامل: favicon.ico (16/32/48)، وصور PNG بمقاسات 16 و32 و180 (Apple touch) و192 و512 (أندرويد/PWA)، بالإضافة إلى كود HTML جاهز وملف webmanifest.