تابع ()rgb در CSS

rgb() Property

تابع ()rgb در CSS رنگ ها را بر مبنای مدل red-green-blue تعریف می کند.

نحوه نوشتار

color: rgb(255,0,0); /* قرمز */
color: rgb(0,255,0); /* سبز */
color: rgb(0,0,255); /* آبی */

rgb(red, green, blue);

در تابع (red, green, blue)rgb هر یک از پارامترها با مقدار عددی بین 0 تا 255 مشخص می شوند. 0 به معنی نبود مطلق آن رنگ و 255 نهایت اشباع آن رنگ است.

مقادیر

red​

شدت رنگ قرمز را با مقدار 0 تا 255 مشخص می کند.

green​

شدت رنگ سبز را با مقدار 0 تا 255 مشخص می کند.

blue​

شدت رنگ آبی را با مقدار 0 تا 255 مشخص می کند.

در مثال زیر نحوه عملکرد این تابع CSS را میبینیم:

html

<section>
   <div class="box1"></div>
   <div class="box2"></div>
   <div class="box3"></div>
</section>
<section>
   <div class="box4"></div>
   <div class="box5"></div>
   <div class="box6"></div>
</section>

css

section {
    display: flex;
    justify-content: space-around;
    flex-wrap: wrap;
}
div {
    width: 200px;
    height: 200px;
    border: 1px solid;
    margin-top: 20px;
}
.box1 { 
    background-color: rgb(255, 0, 0); 
}
.box2 {
    background-color: rgb(0, 255, 0); 
}
.box3 {
    background-color: rgb(0, 0, 255); 
}
.box4 {
    background-color: rgb(255, 255, 255); 
}
.box5 {
    background-color: rgb(127, 127, 127); 
}
.box6 {
    background-color: rgb(0, 0, 0); 
}

مشاهده و ویرایش کد در حالت تمام صفحه

پشتیبانی مرورگرها
تمام مرورگرها از این تابع CSS پشتبانی می کنند.