أدوات تصميم مجانية
لوحات الألوان والتباين، والتدرّجات، والظلال، ومنحنيات cubic-bezier، والأيقونات المفضّلة، ونِسب الأبعاد، ومقاسات صور التواصل، وفحص عمى الألوان. وانسخ الـCSS مباشرة.
- فاحص التباين — اختر لون النص والخلفية لترى نسبة التباين وفق WCAG 2.1، مع شارات نجاح/رسوب لمستويي AA وAAA لأحجام النص العادية والكبيرة، ومعاينة حيّة. يعمل بالكامل في متصفحك.
- حاسبة نسبة الأبعاد — ثبّت نسبة الأبعاد واحسب البُعد الناقص: أدخل العرض لتحصل على الارتفاع المطابق أو العكس، اختر قوالب شائعة مثل 16:9 أو 4:3، واقرأ النسبة المبسّطة. تعمل بالكامل في متصفحك.
- محرّر منحنى بيزييه — اسحب نقطتي التحكّم لتشكيل منحنى تنعيم CSS من نوع cubic-bezier، وشاهد حركة حيّة تعيده، وابدأ من قوالب مثل ease-in-out، وانسخ القيمة الجاهزة للّصق. يعمل بالكامل في متصفحك.
- مولّد ظل الصندوق — اضبط الإزاحة والتمويه والانتشار واللون والشفافية والظل الداخلي لتصميم ظل CSS، وشاهده على بلاطة معاينة حيّة، وانسخ القاعدة بدقّة. يعمل بالكامل في متصفحك.
- مولّد تدرّجات CSS — صمّم تدرّج CSS من عدّة محطّات ألوان — خطّي بأي زاوية أو شعاعي — وشاهده يملأ معاينة حيّة، وانسخ قاعدة الخلفية بدقّة. يعمل بالكامل في متصفحك.
- صانع قوائم التصنيف — أضِف تسميات للأشياء التي تريد ترتيبها، ثم اسحبها إلى فئات S وA وB وC وD لبناء قائمة تصنيف كلاسيكية — ونزّلها كصورة للمشاركة. تُحفظ في هذا المتصفح؛ لا يُرفع أي شيء.
- منتقي الألوان واللوحات — اختر لونًا واقرأه بصيغ HEX/RGB/HSL، ثم ولّد لوحات مكمّلة ومتجانسة وثلاثية وتدرّجات — وانسخ أي لون. داخل متصفحك.
- محاكي عمى الألوان — شاهد لوحة ألوان أو صورة كما يراها من لديه قصور في رؤية الألوان — وأي أزواج ألوانك تنهار إلى الشيء نفسه. فنحو رجل من كل اثني عشر لديه شكل منه، ما يجعل رسمًا يعتمد على الأحمر مقابل الأخضر غير مقروء لشريحة حقيقية من مستخدميك.
- محسّن ملفات SVG — صغّر ملف SVG بإزالة بيانات إنكسكيب وإليستريتور وفيغما، وتقريب الإحداثيات، وعصر المسافات — ثم يعرض الناتج مرسومًا لترى أن شيئًا لم ينكسر. متحفّظ عن قصد: لا يدمج المسارات ولا يحذف معرّفًا مُشارًا إليه.
- استخراج لوحة الألوان من صورة — استخرج لوحة الألوان من أي صورة — الألوان الموجودة فيها فعلًا، مرتّبة بحسب مساحتها، مع قيم hex وRGB وHSL. صدّرها متغيّرات CSS أو كتلة ألوان Tailwind أو JSON. الصورة نفسها تعطي اللوحة نفسها دائمًا.