RGB renk değeri KIRMIZI, YEŞİL ve MAVİ (Red,Green,Blue) ışık kaynaklarını temsil eder.
RGBA renk değeri, RGB’nin Alfa kanalına (opaklığa) sahip bir uzantısıdır.
RGB Renk Değerleri
HTML’de bir renk, şu formül kullanılarak RGB değeri olarak belirtilebilir:
rgb(red, green, blue)
Her parametre (R, G, B), 0 ile 255 arasında bir değerle rengin yoğunluğunu tanımlar.
Bu, 256 x 256 x 256 = 16777216 farklı renk yapabileceğiniz anlamına gelir.
Örneğin, rgb(255, 0, 0) kırmızı olarak görüntülenir çünkü kırmızı en yüksek değere (255) ve diğer ikisi (yeşil ve mavi) 0’a ayarlıdır.
Başka bir örnek, rgb(0, 255, 0) yeşil olarak görüntülenir çünkü yeşil en yüksek değere (255) ve diğer ikisi (kırmızı ve mavi) 0’a ayarlanmıştır.
Siyahı görüntülemek için tüm renk parametreleri sıfır olarak girilir: rgb(0, 0, 0).
Beyazı görüntülemek için tüm renk parametreleri 255 olarak girilir: rgb(255, 255, 255).
Siz de kendi sayfanız içerisinde örnekleri baz alarak denemeler yapabilirsiniz.
<!DOCTYPE html>
<html>
<body>
<h1 style="background-color:rgb(255, 0, 0);">rgb(255, 0, 0)</h1>
<h1 style="background-color:rgb(0, 0, 255);">rgb(0, 0, 255)</h1>
<h1 style="background-color:rgb(60, 179, 113);">rgb(60, 179, 113)</h1>
<h1 style="background-color:rgb(238, 130, 238);">rgb(238, 130, 238)</h1>
<h1 style="background-color:rgb(255, 165, 0);">rgb(255, 165, 0)</h1>
<h1 style="background-color:rgb(106, 90, 205);">rgb(106, 90, 205)</h1>
</body>
</html>
HTML Gri Tonları
Gri tonları üç parametreye eşit değerler verilerek oluşturulur.
<!DOCTYPE html>
<html>
<body>
<h1 style="background-color:rgb(15, 15, 15);">rgb(15, 15, 15)</h1>
<h1 style="background-color:rgb(30, 30, 30);">rgb(30, 30, 30)</h1>
<h1 style="background-color:rgb(60, 60, 60);">rgb(60, 60, 60)</h1>
<h1 style="background-color:rgb(100, 100, 100);">rgb(100, 100, 100)</h1>
<h1 style="background-color:rgb(140, 140, 140);">rgb(140, 140, 140)</h1>
<h1 style="background-color:rgb(180, 180, 180);">rgb(180, 180, 180)</h1>
<h1 style="background-color:rgb(200, 200, 200);">rgb(200, 200, 200)</h1>
<h1 style="background-color:rgb(240, 240, 240);">rgb(240, 240, 240)</h1>
</body>
</html>
HTML RGBA Renk Değerleri
RGBA renk değerleri, bir rengin opaklığını belirten Alpha kanalına sahip RGB renk değerlerinin bir uzantısıdır.
Bir RGBA renk değeri şununla belirtilir:
rgba(r, g, b, alpha)
Alfa parametresi 0,0 (tamamen şeffaf) ile 1,0 (hiç şeffaf değil) arasında bir sayıdır:
<!DOCTYPE html>
<html>
<body>
<h1 style="background-color:rgba(255, 99, 71, 0);">rgba(255, 99, 71, 0)</h1>
<h1 style="background-color:rgba(255, 99, 71, 0.2);">rgba(255, 99, 71, 0.2)</h1>
<h1 style="background-color:rgba(255, 99, 71, 0.4);">rgba(255, 99, 71, 0.4)</h1>
<h1 style="background-color:rgba(255, 99, 71, 0.6);">rgba(255, 99, 71, 0.6)</h1>
<h1 style="background-color:rgba(255, 99, 71, 0.8);">rgba(255, 99, 71, 0.8)</h1>
<h1 style="background-color:rgba(255, 99, 71, 1);">rgba(255, 99, 71, 1)</h1>
</body>
</html>
