أدوات التصميم

لوحة ألوان وتباين

لوحة ألوان وتباين: جهّز الألوان والملفات البصرية وراجعها في واجهتك قبل النشر.

دليل الاستخدام

لوحة ألوان وتباين: المدخلات والنتائج والحدود

لوحة ألوان وتباين: جهّز الألوان والملفات البصرية وراجعها في واجهتك قبل النشر.

تفاصيل الأمثلة والأسئلة أدناه باللغة الإنجليزية حالياً. راجع تنسيق الملف والنتيجة قبل الاستخدام؛ لا تتغير ملفاتك الأصلية.

خطوات الاستخدام

  1. أدخل النص أو استخدم المثال الموضّح في الأداة.
  2. شغّل الأداة بعد التحقق من المدخلات.
  3. راجع المعاينة أو النص الناتج ثم نزّل ملفاً جديداً.

حالة استخدام توضيحية

A brand HEX colour with lighter and darker candidates.

Sample input

#426bd1

طريقة فحص الناتج

Check the actual text/background pairing rather than assuming every palette colour is readable. Contrast calculations for solid colours do not model gradients, photos or all visual accessibility needs.

حدود الأداة

جهّز الألوان والملفات البصرية وراجعها في واجهتك قبل النشر.

حل المشكلات

Inspect the result in the destination component or viewer. A declaration needs a valid CSS context; an image needs suitable dimensions; a sanitized SVG can lose unsupported features.

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

Does a generated palette certify accessibility?

No. Test the specific UI combinations, text size and interaction states in the final design.

What input does Brand palette & contrast need?

Use the sample text shown below, then replace it with your own input. Review the result for the destination where it will be used.

Which options does Brand palette & contrast provide?

There are no extra settings in this version. Select or paste the appropriate input and review the produced result.

المعالجة على جهازك؛ نسّق النص النهائي وراجع الناتج قبل المشاركة.

JavaScript enables the interactive workspace.

تدرج CSS

ظل CSS

زوايا CSS المنطقية

حزمة Favicon

تنظيف SVG

قالب تخطيط متجاوب

صورة إلى ASCII

تنسيق الخطوط

حزمة أيقونات التطبيق