الصق أو استورد مجموعة ألوان وصدّرها فوراً إلى متغيرات CSS وSCSS وإعداد Tailwind وJSON أو عينات SVG — الخطوة الأخيرة لأي لوحة.

الصق قيم HEX (واحدة لكل سطر، أو مفصولة بفواصل/مسافات). يُقبل أيضاً rgb() وhsl().

اللوحة

لم يتم العثور على ألوان صالحة — تحقق من المدخلات.

تنسيق التصدير
كود التصدير

							

كل شيء يعمل في متصفحك — الصق لوحة وانسخ كوداً جاهزاً للإنتاج بأي تنسيق. لا تسجيل، مجاني تماماً.


حول مُصدِّر اللوحة

أداة مصدّر اللوحة هي الخطوة الأخيرة لأي لوحة ألوان: الصق مجموعة من الألوان واحصل على كود جاهز للإنتاج بالصيغة التي يحتاجها مشروعك. تقبل قيم HEX واحدة في كل سطر أو مفصولة بفواصل ومسافات، وتفهم أيضًا صيغتي rgb() وhsl().

تُنتج ستة صيغ إخراج مباشرة: خصائص CSS مخصصة، متغيرات SCSS، كتلة ألوان لإعدادات Tailwind، JSON، نماذج ألوان SVG وقائمة HEX عادية. تحافظ بادئة متغير قابلة للتخصيص على اتساق الأسماء المُنتجة مع كودك، ويمكن نسخ كل صيغة إلى الحافظة أو تنزيلها كملف.

يعمل كل شيء في متصفحك — الألوان التي تلصقها لا تُرسل إلى أي مكان أبدًا. تتناسق طبيعيًا مع أدوات اللوحة الأخرى: استخرج أو ولّد لوحة في مكان آخر، الصقها هنا، وارحل بالمقطع الدقيق الذي يتوقعه ملف التنسيق أو الإطار أو خط أنابيب التصميم لديك.

كيفية استخدام مُصدِّر اللوحة

  1. الصق ألوانك في الحقل — HEX أو rgb() أو hsl()، واحدة في كل سطر أو مفصولة بفواصل.
  2. انقر على "تحديث الألوان" لتحليلها إلى لوحة، أو حمّل النموذج لتجربتها.
  3. اختر صيغة تصدير: متغيرات CSS، SCSS، إعدادات Tailwind، JSON، نماذج ألوان SVG أو HEX عادي.
  4. اضبط بادئة المتغير إذا أردت تسمية مخصصة.
  5. انسخ الكود المُنتج أو نزّله كملف.

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

يُتعرَّف على قيم HEX (بعلامة # أو بدونها)، وصيغتي rgb() وhsl(). يمكنك مزج الصيغ وفصل الألوان بأسطر جديدة أو فواصل أو مسافات — يلتقط المحلّل كل لون صالح ويتجاهل الباقي.

نعم. يحدث التحليل وتوليد الكود بالكامل في متصفحك، لذا الأداة مجانية دون حساب أو رصيد أو حد لعدد اللوحات أو عمليات التصدير.

الصق ألوانك، اختر صيغة "إعدادات Tailwind"، وانسخ الكتلة المُنتجة إلى قسم الألوان في إعدادات Tailwind لديك. يتحكم إعداد بادئة المتغير في أسماء المفاتيح المستخدمة لكل لون.

لا. تبقى الألوان في تبويب متصفحك — لا تُجرى أي طلبات خادم أثناء التحليل أو التصدير، ولا يُحفظ أي شيء بمجرد مغادرتك الصفحة.

تُنتج ملف SVG صغيرًا يعرض كل لون في اللوحة كنموذج مُسمّى. مفيدة لتضمين مرجع بصري للوحة في التوثيق أو ملفات README أو صفحات تسليم التصميم دون التقاط لقطات شاشة.

شارك هذا

عمليات البحث الشائعة
مصدّر لوحة الألوان تصدير الألوان إلى CSS لوحة ألوان إلى SCSS إعداد ألوان Tailwind تصدير لوحة JSON عينات ألوان SVG
هل تحتاج إلى مساعدة؟
هل واجهت مشكلة في هذه الأداة؟ أخبر فريقنا.
الإبلاغ عن مشكلة

أضف هذه الأداة المجانية إلى موقعك الخاص — انسخ والصق الكود أدناه.