رموز الألوان هي طرق لتمثيل الألوان التي نراها كل يوم بتنسيق يمكن للكمبيوتر تفسيره وعرضه. يشيع استخدامها في مواقع الويب وتطبيقات البرامج الأخرى

، وهناك مجموعة متنوعة من التنسيقات ، بما في ذلك رموز الألوان السداسية ، وقيم RGB و HSL ، وأسماء ألوان HTML ، وغيرها.!

يتم تحديد ألوان HTML بأسماء ألوان محددة مسبقًا ، أو بقيم RGB أو HEX أو HSL أو RGBA أو HSLA.

أسماء الألوان

في HTML ، يمكن تحديد اللون باستخدام اسم اللون:

لون الخلفية

يمكنك تعيين لون الخلفية لعناصر HTML:

مثال:

<h1 style="background-color:DodgerBlue;">مرحبا</h1>
<p style="background-color:Tomato;">...يمكن أيضًا استخدام قيم </p>

لون الخط

يمكنك تعيين لون النص:

 مرحبا!

الطريقة الأكثر شيوعًا لتلوين نص HTML هي استخدام رموز الألوان السداسية العشرية (رمز Hex للاختصار).

ما عليك سوى إضافة سمة نمط إلى عنصر النص الذي تريد تلوينه.

مثال:

<h2 style="color:Tomato;">!مرحبا</h2>
<p style="color:DodgerBlue;">...الطريقة الأكثر شيوعًا</p>
<p style="color:MediumSeaGreen;">...ما عليك سوى </p>

لون الحدود

يمكنك تعيين لون الحدود:

مرحبا

مرحبا

مرحبا

مثال:

<h1 style="border:2px solid Tomato;">مرحبا</h1>
<h1 style="border:2px solid DodgerBlue;">مرحبا</h1>
<h1 style="border:2px solid Violet;">مرحبا</h1>

قيم اللون

في HTML ، يمكن أيضًا تحديد الألوان باستخدام قيم RGB وقيم HEX وقيم HSL وقيم RGBA وقيم HSLA.

تم تعيين لون الخلفية لعناصر <div> الثلاثة التالية مع قيم RGB و HEX و HSL:

 يحتوي العنصران التاليان <div> على مجموعة ألوان الخلفية الخاصة بهما مع قيم RGBA وHSLA، والتي تضيف قناة ألفا إلى اللون (لدينا هنا شفافية بنسبة 50%):

مثال:

<h1 style="background-color:rgb(255, 99, 71);">...</h1>
<h1 style="background-color:#ff6347;">...</h1>
<h1 style="background-color:hsl(9, 100%, 64%);">...</h1>
 
<h1 style="background-color:rgba(255, 99, 71, 0.5);">...</h1>
<h1 style="background-color:hsla(9, 100%, 64%, 0.5);">...</h1>