رنگ‌های RGB در CSS

مقدار RGB

یک مقدار رنگ RGB، نمایانگر منابع نور قرمز (RED)، سبز (GREEN) و آبی (BLUE) است.

در CSS، یک رنگ می‌تواند به عنوان یک مقدار RGB و با استفاده از این فرمول مشخص شود: rgb(red, green, blue)

هر پارامتر (قرمز، سبز و آبی) شدت رنگ را با عددی بین 0 تا 255 تعریف می‌کند.

برای مثال، rgb(255, 0, 0) به رنگ قرمز نمایش داده می‌شود، زیرا مقدار قرمز روی بالاترین حد خود (255) و بقیه روی 0 تنظیم شده‌اند.

• برای نمایش رنگ مشکی، تمام پارامترهای رنگ را روی 0 تنظیم کنید: rgb(0, 0, 0).

• برای نمایش رنگ سفید، تمام پارامترهای رنگ را روی 255 تنظیم کنید: rgb(255, 255, 255).

با ترکیب مقادیر RGB زیر، نتیجه را آزمایش کنید:

rgb(255, 99, 71)

• RED: 255

• GREEN: 99

• BLUE: 71

مثال:

در این نمونه، رنگ‌های مختلف با استفاده از مقادیر RGB تعریف شده‌اند.

rgb(255, 0, 0)
rgb(0, 0, 255)
rgb(60, 179, 113)
rgb(238, 130, 238)
rgb(255, 165, 0)
rgb(106, 90, 

طیف‌های رنگ خاکستری معمولاً با استفاده از مقادیر مساوی برای هر سه منبع نور تعریف می‌شوند:

مثال:

rgb(60, 60, 60)
rgb(90, 90, 90)
rgb(120, 120, 120)
rgb(180, 180, 180)
rgb(210, 210, 210)
rgb(240, 240, 240)

مقدار RGBA

مقادیر رنگ RGBA نسخه‌ی توسعه‌یافته‌ی مقادیر RGB همراه با یک کانال آلفا (alpha channel) هستند که شفافیت (opacity) یک رنگ را مشخص می‌کند.

یک مقدار رنگ RGBA به این صورت مشخص می‌شود: rgba(red, green, blue, alpha)

پارامتر آلفا عددی بین 0.0 (کاملاً شفاف) و 1.0 (کاملاً مات) است.

با ترکیب مقادیر RGBA زیر، نتیجه را آزمایش کنید:

rgba(255, 99, 71, 0.5)

• RED: 255

• GREEN: 99

• BLUE: 71

• ALPHA: 0.5

مثال:

در کدهای زیر، یک رنگ ثابت با درجات مختلف شفافیت (از کاملاً شفاف تا کاملاً مات) نمایش داده شده است.

rgba(255, 99, 71, 0)
rgba(255, 99, 71, 0.2)
rgba(255, 99, 71, 0.4)
rgba(255, 99, 71, 0.6)
rgba(255, 99, 71, 0.8)
rgba(255, 99, 71, 1)