توابع rgb() CSS

تعریف و استفاده

CSS rgb() توابع استفاده می‌شود که از مدل رنگ رد-سبز-آبی (RGB) برای تعیین رنگ استفاده می‌کند. همچنین می‌توان یک کانال شفافیت انتخابی (که شفافیت رنگ را نشان می‌دهد) اضافه کرد.

مقدار رنگ RGB از طریق rgb(قرمز سبز آبی) تعیین می‌کند. هر پارامتر تعیین می‌کند قدرت رنگ، می‌تواند عدد صحیحی بین 0 تا 255 یا درصدی بین 0% تا 100% باشد.

مثلاً،rgb(0 0 255) به رنگ آبی نمایش داده می‌شود، زیرا پارامتر آبی به حداکثر مقدار (255) تنظیم شده است و پارامترهای دیگر به 0 تنظیم شده‌اند.

توجه:rgba() توابع است rgb() نام‌های جایگزین توابع. توصیه می‌شود از rgb() توابع.

مثال

تعریف رنگ‌های RGB(A) مختلف:

#p1 {background-color:rgb(255 0 0);} /* قرمز */
#p2 {background-color:rgb(0 255 0);} /* سبز */
#p3 {background-color:rgb(0 0 255);} /* آبی */
#p4 {background-color:rgb(192 192 192);} /* خاکستری */
#p5 {background-color:rgb(255 255 0);} /* زرد */
#p6 {background-color:rgb(255 0 255);} /* قرمز توت‌فرنگی */
#p7 {background-color:rgb(255 0 255 / 0.2);} /* قرمز توت‌فرنگی با شفافیت */
#p8 {background-color:rgb(0 0 255 / 50%);} /* آبی با شفافیت */

آزمایش کنید

نحوه استفاده در CSS

نحوه استفاده از مقادیر تعیین‌شده

rgb(R G B / A)
مقدار توضیح
R

این رنگ اصلی است که رنگ‌های نسبی بر اساس آن تعریف می‌شوند.

همچنین می‌توان از none (معادل 0%) استفاده کرد.
G

ضروری. تعریف قدرت سبز، می‌تواند عدد صحیحی بین 0 تا 255 یا درصدی بین 0% تا 100% باشد.

همچنین می‌توان از none (معادل 0%) استفاده کرد.
B

ضروری. تعریف قدرت آبی، می‌تواند عدد صحیحی بین 0 تا 255 یا درصدی بین 0% تا 100% باشد.

همچنین می‌توان از none (معادل 0%) استفاده کرد.
/ A

اختیاری. مقدار کانال شفافیت رنگ را نشان می‌دهد، 0% (یا 0) نشان‌دهنده شفافیت کامل و 100% (یا 1) نشان‌دهنده نیمه شفافیت کامل است.

همچنین می‌توان از none (که به معنای کانال شفافیت نیست) استفاده کرد. مقدار پیش‌فرض 100% است.

نحوه استفاده از مقادیر نسبی

rgb(from color R G B / A)
مقدار توضیح
from color

با کلمه کلیدی from شروع می‌شود، پس از آن رنگ اصلی را نشان می‌دهد.

این رنگ اصلی است که رنگ‌های نسبی بر اساس آن تعریف می‌شوند.
R

این رنگ اصلی است که رنگ‌های نسبی بر اساس آن تعریف می‌شوند.

همچنین می‌توان از none (معادل 0%) استفاده کرد.
G

ضروری. تعریف قدرت سبز، می‌تواند عدد صحیحی بین 0 تا 255 یا درصدی بین 0% تا 100% باشد.

همچنین می‌توان از none (معادل 0%) استفاده کرد.
B

ضروری. تعریف قدرت آبی، می‌تواند عدد صحیحی بین 0 تا 255 یا درصدی بین 0% تا 100% باشد.

همچنین می‌توان از none (معادل 0%) استفاده کرد.
/ A

اختیاری. مقدار کانال شفافیت رنگ را نشان می‌دهد، 0% (یا 0) نشان‌دهنده شفافیت کامل و 100% (یا 1) نشان‌دهنده نیمه شفافیت کامل است.

همچنین می‌توان از none (که به معنای کانال شفافیت نیست) استفاده کرد. مقدار پیش‌فرض 100% است.

جزئیات فنی

نسخه: CSS2

پشتیبانی مرورگر

اعداد در جدول نشان‌دهنده نسخه اولین مرورگر هستند که این تابع را کامل پشتیبانی می‌کند.

Chrome Edge Firefox Safari Opera
rgb()
1 4 1 1 3.5
rgb(شفافیت)
65 79 52 12.1 52
پارامترها با فاصله خالی جدا شده‌اند
65 79 52 12.1 52