أداة اختيار الألوان واستخراج كود HEX/RGB

استخراج رموز الألوان، التحويل بين الصيغ، وتوليد تدرجات لونية متناسقة.

أدوات الوسائط والملفات
100% على جانب العميل · خاص وآمن
أداة اختيار الألوان واستخراج كود HEX/RGB

استخراج رموز الألوان، التحويل بين الصيغ، وتوليد تدرجات لونية متناسقة.

مركز المعرفة والمفاهيم

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

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

تعمل هذه الأداة محلياً بالكامل داخل المتصفح (Client-Side). لا يتم رفع صورك أو مقاطع الفيديو أو الملفات الصوتية أو مستندات PDF إلى أي خادم خارجي؛ تتم المعالجة بأمان تام داخل ذاكرة جهازك.

البنية الأساسية والصيغة الرياضية

HEX = Concat( DecToHex(R), DecToHex(G), DecToHex(B) )

A standard Hex code (e.g., #FF5733) is simply three 8-bit integers (0 to 255) converted into base 16 format, representing the Red, Green, and Blue light channels.

أفضل الممارسات والإرشادات الأساسية

  • Understand HSL for UI Design: While Hex is the web standard, Hue Saturation Lightness (HSL) is vastly superior for developers. Changing `hsl(200, 50%, 50%)` to `hsl(200, 50%, 40%)` instantly creates a perfect darker hover state.
  • Avoid Pure Black: In UI design, pure black (`#000000`) on pure white creates severe eye strain due to absolute contrast. Use a dark slate gray (like `#111827`) to soften the visual impact.
  • Check Contrast Accessibility: Selecting a beautiful color palette is useless if visually impaired users cannot read the text. Always verify your selected colors against the WCAG 4.5:1 minimum contrast ratio.

الأسئلة الشائعة (FAQ)

What does the 4th value in an RGBA code do?
The 'A' stands for Alpha (opacity). It is a float value between 0.0 (completely transparent) and 1.0 (completely solid). Modern CSS also supports 8 digit hex codes where the final two characters represent the alpha channel.
Why do colors look different on my phone vs my monitor?
Monitors possess different hardware color gamuts (sRGB vs Display P3) and brightness calibrations. A hex code is a mathematical instruction, but the physical screen hardware ultimately decides how that instruction is illuminated.
What is a Triadic color harmony?
A triadic harmony selects three colors that are evenly spaced (120 degrees apart) on the standard color wheel, providing a highly vibrant, balanced contrast often used in branding.