Ease Colors

عجلة الألوان

ابدأ بلون واحد وولّد تناغمات متممة ومتماثلة وثلاثية وغيرها — ثم صدّرها CSS أو Tailwind v4 أو SVG أو PNG.

اللوحة

درجات اللون الأساسي

دليل نظرية الألوان

افهم العجلة، ثم اكسر القواعد بذوق

ترتب العجلة درجات الألوان في دائرة لتغدو العلاقات مكانية. البعد يعني التباين، والقرب يعني الهدوء. كل ما يلي تفاعلي — حرّك العجلة أعلاه لتفهم الأفكار أسرع.

كيف تستخدم هذه العجلة

  1. اختر التناغم — هندسة لوحتك (متقابلات، جيران، مثلث…).
  2. اسحب أي نقطة على القرص — الزاوية تحدد اللون، والبعد عن المركز يحدد التشبع.
  3. اسحب حلقة الإضاءة الخارجية للخلفيات والنصوص واللمسات.
  4. انسخ القيم بصيغتك، ثم صدّر الرموز لـ CSS أو Tailwind.

تلميح: شارك أي نتيجة — فالرابط يحفظ دائمًا لونك الأساسي وتناغمك وإضاءتك.

التناغمات الستة

المتمم — زوج متقابل
أقصى توتر. اترك جهة للمسات ودع الأخرى تسيطر.
المتمم المنقسم — الأساسي + جارا مقابله
بنفس الحيوية تقريبًا لكنه أكثر تسامحًا. خيار ممتاز للعلامات.
المتماثل — ثلاثة جيران
هادئ ومتماسك. أضف لمسة متممة فقط حيث تحتاج إجراءً.
الثلاثي — مثلث 120°
جريء ومتوازن. دع لونًا واحدًا يملك ~60% من الواجهة.
الرباعي — زوجان متممان
غني لكنه مزدحم. حدد تسلسلًا واضحًا قبل اللون الرابع.
المربع — أربعة أركان 90°
طاقة متساوية في كل اتجاه. الأفضل مع قواعد صارمة لكل سطح.

الظلال والصبغات والدرجات

درجة واحدة لا تكفي للواجهات أبدًا. امزج مع الأسود للظلال (العناوين، التحويم)، ومع الأبيض للصبغات (الخلفيات، النوافذ)، ومع الرمادي للدرجات (النص الخافت، الحدود).

نيلي من الظل إلى الصبغة. المنطق نفسه يحرك كل لوحة أعلاه.

الأساسية والثانوية والثالثية

في عجلة RYB الكلاسيكية، الأحمر والأصفر والأزرق أساسية؛ ومزجها يعطي البرتقالي والأخضر والبنفسجي. على الشاشة نمزج الضوء (RGB)، لذا تحسب الأداة بـ HSL/HSV — الدائرة نفسها مضبوطة للبكسل.

Twelve stops around the disc; every other color contains a trace of a primary.

عجلة ألوان مجانية على الإنترنت ومنتقي ألوان ومولد لوحات

Ease Colors هي عجلة ألوان مجانية على الإنترنت للمصممين والمطورين الذين يحتاجون ألوانا موثوقة دون مغادرة المتصفح. اختر لونا أساسيا على منتقي العجلة التفاعلي، وعاين ستة تناغمات معا، ثم انسخ أكواد HEX أو RGB أو HSL أو OKLCH الجاهزة للإنتاج. لا يُرفع شيء إلى أي خادم، ولا حاجة لإنشاء حساب، وكل نتيجة تحصل على رابط قابل للمشاركة يستعيد لونك الأساسي وتناغمك وسطوعك بدقة. يمدّ شريط التدرجات المدمج كل لون أساسي من الفاتح إلى الداكن، وتبقى الصفحة كاملة قابلة للتشغيل بلوحة المفاتيح — مع تركيز مرئي في كل خطوة.

ما هي عجلة الألوان؟

عجلة الألوان هي مخطط دائري للدرجات تُرتَّب فيه الألوان بحيث تصبح العلاقات مكانية: الألوان المتجاورة تهدّئ، والمتقابلة تخلق التوتر. عجلة الألوان الأساسية الكلاسيكية من دروس الرسم تمزج الأحمر والأصفر والأزرق، بينما عجلة RGB على شاشتك تمزج الضوء. تحسب هذه الأداة كل تناغم في فضاء HSV/HSL المضبوط للبكسلات لا للأصباغ. اسحب نقطة على القرص لتحديد الدرجة، واقترب من الحافة للتشبع، وأدر حلقة السطوع الخارجية لحمل درجة واحدة من خلفية فاتحة إلى نص داكن. ولأن القرص يُرسم دائما بأقصى حيوية، تبقى العلامات متفرقة وقابلة للسحب حتى مع اللوحات شبه السوداء أو شبه البيضاء — فالهندسة لا تنهار أبدا عند الأطراف.

كيف تستخدم عجلة الألوان هذه على الإنترنت

عجلة الألوان على الإنترنت هذه هي أيضا منتقي ألوان متكامل على الإنترنت وأداة ألوان:

  1. اكتب قيمة HEX، أو افتح منتقي النظام، أو خذ عينة من أي بكسل على شاشتك.
  2. اختر المتماثل أو المتكامل أو المتكامل المنقسم أو الثلاثي أو الرباعي أو المربع — أو حرّر يدويا قائمة مخصصة من لونين إلى ثمانية.
  3. اضبط السطوع بالحلقة الخارجية واقرأ كل عينة كقيمة ست عشرية أو RGB أو HSL أو OKLCH.
  4. انسخ الأكواد، أو نزّل SVG/PNG، أو صدّر رموز CSS وTailwind.

تستكشف الاتجاهات؟ اضغط Shuffle في معرض لوحات الألوان لجولة عشوائية بين أكثر من 400 مجموعة مختارة.

قبل النشر، شغّل محاكاة عمى الألوان لمعاينة الحمرانية والخضرانية والزرقانية وغياب اللون، وحافظ على النص مقروءا بتسميات تباين تلقائية على كل شريط.

منتقي ألوان كامل: HEX وRGB وHSL وOKLCH

كل منتقي ألوان في هذه الصفحة يتحدث أربع صيغ. يقبل حقل HEX أي كود مثل #EDEA37، ويقرأ منتقي RGB الثلاثيات مثل rgb(99, 102, 241)، بينما يغطي HSL مع OKLCH الاتساق الإدراكي الذي لا يبلغه RGB وحده. تحصل فرق الواجهات على سير منتقي HTML ومنتقي CSS جاهز: صدّر متغيرات CSS أو رموز سمة Tailwind v4 أو كائن إعداد Tailwind v3 أو JSON لفيغما أو الأكواد فقط. تلتقط قطارة الشاشة المدمجة (EyeDropper) أي بكسل على شاشتك، وتبقى نقاط عجلة الاختيار قابلة للسحب عند أي سطوع. منتقي الألوان على الإنترنت هذا مجاني، مع تصديرات تدعم الشفافية وتغطي كل حالة RGBA. يجمّد الوضع المخصص أي مجموعة مولّدة في قائمة قابلة للتحرير يدويا: فتّح عينة أو أغمقها، واسحب لإعادة الترتيب، وأدخل وسطا ممزوجا أو مدّد أي طرف — وينعكس كل تعديل فورا في رابط المشاركة.

منتقي الألوان من الصورة

يلجأ المصورون ومصممو العلامات إلى منتقي ألوان الصور لاستعارة اللوحات من العالم الحقيقي. ارفع صورة — أو الصق رابط صورة — ويعرض المنتقي من الصورة عدسة مكبرة بشبكة بكسلات وتقاطع، ليقرأ البكسل الذي تشير إليه بدقة، حتى عند تقريب 800%. ثبّت اللون، وانسخه HEX أو RGB أو HSL أو OKLCH، وأرسله إلى العجلة بنقرة. اضبط حجم اللوحة المستخرجة من لونين إلى عشرة، ونزّل الشريط PNG أو احفظه في خزانة المتصفح لتفتحه لاحقا. كل صورة تفتحها تبقى على جهازك — لا يُرفع شيء.

مولد لوحات الألوان واللوحة من الصورة

عندما لا تكفي عينة واحدة، يبني مولد لوحات الألوان لوحة جاهزة من الصورة في ثوان. يقيّم البكسلات حسب التكرار والتشبع، ويرشّح شبه المكرر، ثم يرتّب الفائزين حسب الدرجة — من لونين إلى عشرة يمكن إعادة ترتيبها وتمديدها وحذفها. سيقدّر منقحو البورتريه مجموعات ألوان البشرة المخصصة، إلى جانب مجموعات الباستيل والأزرق والأخضر. احفظ المفضلة في خزانة المتصفح، ونزّل أي لوحة ألوان PNG أو SVG، وصدّر الرموز للتسليم. تنزلق المقابض القابلة للسحب فوق الصورة عند نقاط أخذها — فإعادة أخذ اللون تصبح سحبا لا تخمينا.

الألوان المتكاملة دون تخمين

تقرن عجلة الألوان المتكاملة الدرجات بفارق 180° لأقصى توتر — البرتقالي ضد الأزرق، والبنفسجي ضد الأصفر. يعلّم شريط المتكاملات لونك الأساسي بنقطة سوداء، لترى بالضبط أي عينة تحجزها للأزرار والروابط بينما يقود اللون المهيمن التصميم. تقف إلى جانبها الدورانات المنقسمة والثلاثية والرباعية والمربعة في لوحة التناغمات كبدائل أنعم أو أجرأ.

لوحات موسمية لكل درجة تحتية

تعيش اثنا عشر نظاما للتحليل اللوني الموسمي في المعرض — سبع عشرة لوحة لكل منها. تبدأ المواجيز الدافئة الخافتة بلوحة خريف ناعم، بينما تتجه الباردة الخافتة إلى لوحة صيف ناعم. تخدم مجموعات الخريف عالية الدفء حملات الخريف وعلامات الطعام، وتمنح لوحة شتاء عميق بريق الجواهر على شبه أسود للفخامة والمساء. تسحب التصاميم الفاتحة الدافئة من لوحة ربيع فاتح، والبساطة المتجددة من لوحة صيف بارد، والعمل الداكن الفاخر من لوحة خريف عميق. التباين الثلجي ملك لوحة شتاء بارد، والدفء الساطع ملك لوحة ربيع دافئ، والأنصاف الناعمة ملك لوحة صيف حقيقي، والفخامة الهادئة ملك اللوحة المحايدة. أجواء أوسع من الصيف والشتاء والربيع والخريف تكمل أكثر من 400 مجموعة — لكل منها نسخ HEX وRGB وHSL وOKLCH بنقرة.

بديل مجاني لعجلة ألوان Adobe

إذا وصلت باحثا عن Adobe color wheel أو Adobe color picker أو Canva color wheel أو Google color picker، فأنت تعرف المهمة: تحويل لون علامة واحد إلى مجموعة متوازنة. يغطي Ease Colors الأرضية نفسها — التناغمات وأكواد HEX/RGB/HSL/OKLCH وأخذ العينات من الصور وتصدير اللوحات — مجانا في المتصفح، مع روابط قابلة للمشاركة ودون حساب يقف بينك وبين العينات. تحكم بلوحة المفاتيح أولا، وتسميات لقارئات الشاشة، ووضع تقليل الحركة مشمولة.

أسئلة اللوحات وإجاباتها

كيف أنسخ لونًا؟

انقر أي عينة. بدّل الصيغة إلى HEX أو RGB أو HSL أو OKLCH قبل النسخ.

كيف أشارك لوحتي؟

اضغط «نسخ رابط المشاركة». فالرابط يشفّر لونك الأساسي وتناغمك وإضاءتك.

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

نعم. كل HEX ورمز وتصدير ملك لك — دون نسب.

أسئلة عجلة الألوان مع إجاباتها

ما هي عجلة الألوان؟

عجلة الألوان مخطط دائري يرتب الدرجات بحيث تصبح العلاقات مكانية: الألوان المتجاورة تهدّئ، والمتقابلة تخلق التوتر. تدرّس حصص الرسم عجلة أحمر-أصفر-أزرق لمزج الدهان؛ بينما تستخدم الشاشات عجلة RGB تمزج الضوء. يستخدمها المصممون لاختيار الألوان الأساسية وبناء التناغمات وفحص التباين قبل أن تصل اللوحة إلى التصميم.

كيف أستخدم عجلة الألوان؟

ابدأ بلون أساسي واحد — اكتب كود HEX أو افتح منتقي النظام أو خذ عينة من شاشتك. اختر تناغما مثل المتماثل أو المتكامل أو الثلاثي، ثم اضبط السطوع بالحلقة الخارجية حتى تكتمل درجات الخلفية والنص والتمييز. انسخ كل عينة HEX أو RGB أو HSL أو OKLCH والصق الأكواد في CSS أو Tailwind أو Figma.

ما الغرض الرئيسي من عجلة الألوان؟

غرضها الرئيسي إخراج التخمين من دمج الألوان. بدلا من مزاوجة الأزواج بالنظر، تقرأ الهندسة: المسافة تعني التباين والتجاور يعني الهدوء. وهذا يمنح كل واجهة تسلسلا واضحا — درجة مهيمنة واحدة وبضع داعمة وتمييز محجوز — لتسقط الأزرار والروابط والعناوين حيث تتوقعها العين.

ما الأنواع الثمانية الرئيسية لأنظمة الألوان؟

تذكر أدبيات التصميم عادة ثمانية: أحادي الدرجة (درجة واحدة وسطوعات كثيرة)، والمتماثل (الجيران)، والمتكامل (المتقابلات)، والمتكامل المنقسم (أساس وجارا مقابِله)، والثلاثي (مثلث)، والرباعي أو المستطيل (زوجان متكاملان)، والمربع (أربع زوايا)، واللالوني أو المحايد (الأسود والأبيض والرمادي). تغطي هذه الأداة ستة منها مباشرة، مع وضع مخصص لقوائم محررة يدويا من لونين إلى ثمانية.

كيف أختار لونا من عجلة الألوان؟

اسحب نقطة على القرص: الزاوية تحدد الدرجة والبعد عن المركز يحدد التشبع. اسحب الحلقة الخارجية لتحديد السطوع دون مساس الدرجة والتشبع. يمكنك أيضا كتابة قيمة HEX دقيقة أو فتح علبة ألوان النظام أو اختيار أي بكسل على شاشتك بقطارة الشاشة — وكل الطرق تصل إلى اللون الأساسي نفسه القابل للمشاركة.

ما الغرض من منتقي الألوان؟

منتقي الألوان يحوّل الاختيار البصري إلى قيمة دقيقة قابلة لإعادة الاستخدام. يقرأ أي لون كأكواد HEX أو RGB أو HSL أو OKLCH ليتكلم المصممون والمطورون لغة واحدة: ما تنقره مطابق بتًّا لما يصل إلى CSS أو رموز Tailwind أو أنماط Figma — دون تقريب الدرجات بالنظر.

ما الأنواع المختلفة لمنتقيات الألوان؟

الأنواع الرئيسية هي منتقيات العجلة أو القرص (الدرجة مع التشبع بنظرة)، ومنتقيات المنزلقات (قنوات RGB أو HSL)، وحقول HEX (قيم مباشرة)، والقطارات أو منتقيات الشاشة (تأخذ عينات من شاشتك)، ومنتقيات الصور (عدسة على صورة)، ومكتبات اللوحات (مجموعات مختارة مثل معرض الـ400 هنا). يجمع هذا الموقع الستة في تدفق واحد.

ما هو كود اللون؟

كود اللون قيمة نصية تصف لونا واحدا بدقة. يكتبه HEX بست خانات ست عشرية (#EDEA37)؛ ويعدد RGB قنوات الأحمر والأخضر والأزرق؛ ويعدد HSL الدرجة والتشبع والسطوع؛ وOKLCH صيغة إدراكية أحدث تتساوى فيها الخطوات العددية في الاختلاف المرئي. الأربعة تصف العينة نفسها — والصيغة تغيّر فقط كيف تقرؤها وتحررها.

كيف أستخدم منتقي الألوان؟

اختر لونا بالعجلة أو المنزلق أو حقل HEX أو قطارة الشاشة، ثم انسخه بالصيغة التي يحتاجها مشروعك — HEX للويب وRGB أو RGBA لكود التطبيقات وHSL للتعديلات السريعة وOKLCH للاتساق الإدراكي. الصق القيمة في stylesheet أو إعداد Tailwind أو أداة التصميم، واحتفظ بالرابط ليكون اللون الدقيق على بعد نقرة لاحقا.

ما الغرض من لوحة الألوان؟

لوحة الألوان تُبقي كل أسطح المنتج بلغة بصرية واحدة. توزع الأدوار — الخلفية والنص والتمييز والحالات — لتبدو الواجهات متماسكة بدلا من مركبة من عينات عشوائية. اللوحة الجيدة تدمج التباين والتسلسل مقدما، أي إصلاحات مقروئية أقل وعلامة أقوى وأشهر.

ما أنواع لوحات الألوان؟

تشمل الأنواع الشائعة اللوحات أحادية الدرجة والمتماثلة والمتكاملة المبنية بهندسة العجلة؛ ولوحات الباستيل والنيون المحددة بالطاقة؛ واللوحات الموسمية حسب الدرجة التحتية للبشرة (من خريف ناعم إلى محايد)؛ ولوحات العلامات المثبتة على ألوان الشركات؛ واللوحات المستخرجة المأخوذة من الصور. يضم المعرض هنا كلها — أكثر من 400 مجموعة في أكثر من 60 فئة.

كيف أختار لوحة ألوان؟

ابدأ بلون أساسي يناسب المزاج — دافئ وخافت أو بارد ومتجدد أو داكن ودرامي. وسّعه بتناغم ثم اختبر النتيجة كما سيلقاها المستخدمون: تباين نص المتن وتمييز الأزرار ومحاكاة عمى الألوان للحمرانية والخضرانية والزرقانية. إن نجت من الثلاثة فشارك الرابط وانشر.