Skip to main content
Toolzer — Free Online Tools

منتقي ألوان Tailwind — القائمة الكاملة

استعرض جميع ألوان Tailwind CSS الافتراضية بكل درجاتها (50-950) مع نسخ HEX وأسماء الفئات.

عن الأداة

أداة منتقي ألوان Tailwind CSS تعرض القائمة الكاملة لألوان Tailwind الافتراضية (Slate, Gray, Red, Orange, Amber, Yellow, Lime, Green, Emerald, Teal, Cyan, Sky, Blue, Indigo, Violet, Purple, Fuchsia, Pink, Rose) بكل درجاتها من 50 (فاتح جدًا) إلى 950 (داكن جدًا). كل مربع لون يعرض اسم الفئة كاملاً (مثل `bg-blue-500`, `text-red-700`) وكود HEX الموافق، ويمكن نسخ أي منهما بضغطة واحدة. مفيدة للمطوّرين الذين يبنون واجهات بـ Tailwind ويحتاجون اختيار الدرجة الصحيحة بسرعة، ولمن يريد مطابقة لون من تصميم Figma بأقرب Tailwind color دون الحاجة لضبط `tailwind.config`.

الأسئلة الشائعة

أي إصدار من Tailwind؟

الأداة تعرض قائمة ألوان Tailwind CSS v3+ الافتراضية (Extended Palette) التي تضم 22 عائلة لونية × 11 درجة.

هل تشمل ألوان مخصّصة من tailwind.config؟

لا. تعرض الأداة الألوان الافتراضية فقط. لو كان مشروعك يستخدم ألوانًا مخصّصة راجعها من ملف الإعداد الخاص بك.

كيف أختار الدرجة المناسبة؟

قاعدة عامة: 50-200 للخلفيات الفاتحة، 400-600 للأزرار والعناصر الأساسية، 700-900 للنصوص والحدود الداكنة، 950 للوضع الداكن (Dark Mode).

هل يوجد فحص للتباين؟

بجانب كل لون يوجد مؤشر لتباينه مقابل الأبيض والأسود ليساعدك على اختيار لون النص المناسب فوقه.