الرسومات / الألوان

مولّد لوحة الألوان: تنسيقات متناغمة بنقرة واحدة

أنشئ لوحات ألوان استنادًا إلى نظرية الألوان: متجاورة، أو متكاملة، أو ثلاثية، أو متكاملة منقسمة، أو أحادية اللون، أو عشوائية، من 3 إلى 8 ألوان. ثبّت الألوان التي تعجبك وأعد إنشاء البقية، وتحقق من تباين كل لون مع الأبيض، ثم صدّر اللوحة كمتغيرات CSS، أو إعداد Tailwind، أو JSON، أو رموز hex، أو PNG.

مولّد لوحة الألوان: تنسيقات متناغمة بنقرة واحدة: تبدأ كل لوحة من درجة لون أساسية، مأخوذة من لون مثبّت إن وُجد، ثم توزّع درجات الألوان الأخرى وفق القاعدة المختارة: خطوات بمقدار 30° للألوان المتجاورة، أو درجة اللون المقابلة للألوان المتكاملة، أو خطوات بمقدار 120° للألوان الثلاثية، أو 150° على جانبي اللون للألوان المتكاملة المنقسمة، أو درجة لون واحدة تمتد من الداكن إلى الفاتح للألوان الأحادية. تتغير الإضاءة والتشبّع لتضم المجموعة ألوانًا فاتحة ومتوسطة وداكنة، ويعرض كل لون نسبة تباينه مع الأبيض وفق WCAG. يعمل 100% محليًا في المتصفح، من دون رفع أي ملفات إلى الخادم.

الفئة: أدوات المطورين
مرات التشغيل: في المتصفح
التكلفة: مجاني · بلا تسجيل
التوفر: جاهز للاستخدام

مساحة عمل لوحة الألوانمعالجة محلية

تعمل بالكامل في المتصفح

التناغمالألوان

أو اضغط مفتاح المسافة. اقفل الألوان التي تريد الاحتفاظ بها.

#64A6F52.5:1 على خلفية بيضاء

#382B9D10.5:1 على خلفية بيضاء

#772BB77.5:1 على خلفية بيضاء

#BE4BBA4.3:1 على خلفية بيضاء

#E0367B4.2:1 على خلفية بيضاء

تصدير بصيغة

:root {
  --color-1: #64a6f5;
  --color-2: #382b9d;
  --color-3: #772bb7;
  --color-4: #be4bba;
  --color-5: #e0367b;
}

استخدام لوحة ألوان

من التوزيعات الشائعة استخدام لون محايد واحد لنحو 60%، ولون ثانٍ لنحو 30%، ولون إبراز لنحو 10%، بحيث يُستخدم اللون الأقوى باعتدال للأزرار والعناصر البارزة.

التباين

تُعد نسبة 4.5:1 الحد الأدنى وفق WCAG AA للنص العادي، و3:1 للنص الكبير؛ أما 7:1 فتستوفي المستوى AAA.

طريقة الاستخدام

اختر تناغمًا وعدد الألوان.
اضغط على «إنشاء» أو مفتاح المسافة حتى تحصل على النتيجة التي تعجبك؛ وثبّت الألوان للاحتفاظ بها.
انسخ اللوحة ككود أو نزّلها بصيغة PNG.

الخصوصية والقيود

يُنشأ كل شيء في المتصفح.

أدوات ذات صلة

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

كيف أحتفظ بلون يعجبني؟

اضغط على رمز القفل الخاص به. تبقى الألوان المثبّتة كما هي، ويحدد اللون الأول أيضًا درجة اللون الأساسية التي تُبنى حولها بقية الألوان.

هل يمكنني استخدام لون علامتي التجارية؟

نعم، اضغط على عيّنة لون لتعيينها على أي لون، ثم ثبّتها وأنشئ بقية الألوان حولها.

هل النص على اللوحة مقروء؟

تعرض كل عيّنة نسبة تباينها مع الأبيض. تشترط WCAG نسبة لا تقل عن 4.5:1 للنص العادي، لذلك يحتاج اللون الذي تقل نسبته عن ذلك إلى نص داكن فوقه.

أداة مجانية · عدد مرات الاستخدام في المتصفح · لا يتطلب حسابًا