CSS RGB Colors

CSS RGB வண்ணங்கள்

RGB மதிப்பு

ஒரு RGB வண்ண மதிப்பு RED, GREEN மற்றும் BLUE ஒளி மூலங்களைக் குறிக்கிறது.

CSS இல், ஒரு வண்ணம் பின்வரும் சூத்திரத்தைப் பயன்படுத்தி RGB மதிப்பாகக் குறிப்பிடப்படலாம்:

rgb(red, green, blue)

ஒவ்வொரு அளவுருவும் (red, green, மற்றும் blue) 0 மற்றும் 255 க்கு இடையே வண்ணத்தின் தீவிரத்தை வரையறுக்கிறது.

எடுத்துக்காட்டாக, rgb(255, 0, 0) சிவப்பாக காட்டப்படும், ஏனெனில் சிவப்பு அதன் அதிகபட்ச மதிப்பாக அமைக்கப்பட்டுள்ளது (255) மற்றும் மற்றவை 0 ஆக அமைக்கப்பட்டுள்ளன.

கருப்பு காட்ட, அனைத்து வண்ண அளவுருக்களையும் 0 ஆக அமைக்கவும், இப்படி: rgb(0, 0, 0).

வெள்ளை காட்ட, அனைத்து வண்ண அளவுருக்களையும் 255 ஆக அமைக்கவும், இப்படி: rgb(255, 255, 255).

கீழே உள்ள RGB மதிப்புகளை கலந்து பரிசோதிக்கவும்:

RED 255
GREEN 99
BLUE 71
rgb(255, 99, 71)

எடுத்துக்காட்டுகள்

rgb(255, 0, 0)

சிவப்பு

rgb(0, 0, 255)

நீலம்

rgb(60, 179, 113)

மெடியம் சீ கிரீன்

rgb(238, 130, 238)

வயலட்

rgb(255, 165, 0)

ஆரஞ்சு

rgb(106, 90, 205)

ஸ்லேட் ப்ளூ

சாம்பல் நிற நிழல்கள்

சாம்பல் நிற நிழல்கள் அடிக்கடி மூன்று ஒளி மூலங்களுக்கும் சமமான மதிப்புகளைப் பயன்படுத்தி வரையறுக்கப்படுகின்றன:

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 வண்ண மதிப்புகளின் நீட்டிப்பாகும் - இது ஒரு வண்ணத்திற்கான ஒளிபுகா தன்மையைக் குறிக்கிறது.

ஒரு RGBA வண்ண மதிப்பு பின்வருமாறு குறிப்பிடப்படுகிறது:

rgba(red, green, blue, alpha)

ஆல்பா அளவுருவானது 0.0 (முழுமையாக வெளிப்படையான) மற்றும் 1.0 (வெளிப்படையானது அல்ல) க்கு இடையே உள்ள எண்ணாகும்:

கீழே உள்ள RGBA மதிப்புகளை கலந்து பரிசோதிக்கவும்:

RED 255
GREEN 99
BLUE 71
ALPHA 0.5
rgba(255, 99, 71, 0.5)

எடுத்துக்காட்டுகள்

rgba(255, 99, 71, 0)

முழுமையாக வெளிப்படையான

rgba(255, 99, 71, 0.2)

20% ஒளிபுகா

rgba(255, 99, 71, 0.4)

40% ஒளிபுகா

rgba(255, 99, 71, 0.6)

60% ஒளிபுகா

rgba(255, 99, 71, 0.8)

80% ஒளிபுகா

rgba(255, 99, 71, 1)

முழுமையாக ஒளிபுகாத

CSS பயிற்சிகள்

பயிற்சி:

பின்வருவனவற்றில் எது RGB வடிவத்தில் சிவப்பு வண்ணத்தைக் குறிக்கிறது?

rgb(255, 255, 255)
✗ தவறு! இது வெள்ளை வண்ணம் - அனைத்து மதிப்புகளும் அதிகபட்சமாக உள்ளன
rgb(255, 0, 0)
✓ சரி! இது சிவப்பு வண்ணம் - சிவப்பு மட்டும் அதிகபட்சம், பச்சை மற்றும் நீலம் பூஜ்ஜியம்
rgb(0, 0, 255)
✗ தவறு! இது நீல வண்ணம் - நீலம் மட்டும் அதிகபட்சம்
rgb(0, 255, 0)
✗ தவறு! இது பச்சை வண்ணம் - பச்சை மட்டும் அதிகபட்சம்