RGB html color codes understanding tutorial
In HTML, CSS colors can be represented using RGB (Red, Green, Blue) values. The RGB color model is a way to specify HTML colors by indicating the intensity of red, green, and blue in a particular color. Each of these colors can have a value between 0 and 255, representing the intensity of that color.
To use RGB colors in HTML, you can apply them in various ways:
Inline CSS:
You can use inline CSS to apply RGB colors directly to HTML elements using the style attribute.
<div style="color: rgb(255, 0, 0);">This text is red</div>
CSS Stylesheet:
Define a class or ID in your CSS file and assign the RGB color to it.
<!DOCTYPE html>
<html>
<head>
<style>
.custom-color {
color: rgb(0, 128, 0);
}
</style>
</head>
<body>
<p class="custom-color">This text is green</p>
</body>
</html>
RGB Values:
Here are a few examples of RGB values for different colors:
- Red: rgb(255, 0, 0)
- Green: rgb(0, 255, 0)
- Blue: rgb(0, 0, 255)
- Purple: rgb(128, 0, 128)
- Yellow: rgb(255, 255, 0)
- White: rgb(255, 255, 255)
- Black: rgb(0, 0, 0)
You can use these values to specify the desired color for text, backgrounds, borders, and other styling elements within your HTML document.
Remember, besides RGB, there are other color representation methods like hexadecimal colors (#RRGGBB) and named colors that you can also use in HTML and CSS for defining colors.
Example:
<h2 style="background-color:rgb(238, 130, 238);">rgb(238, 130, 238)</h2>
<h2 style="background-color:rgb(255, 165, 0);">rgb(255, 165, 0)</h2>
<h2 style="background-color:rgb(106, 90, 205);">rgb(106, 90, 205)</h2>
<h2 style="background-color:rgb(255, 0, 0);">rgb(255, 0, 0)</h2>
<h2 style="background-color:rgb(0, 0, 255);">rgb(0, 0, 255)</h2>
<h2 style="background-color:rgb(60, 179, 113);">rgb(60, 179, 113)</h2>
Output:
Comments :
Post a Comment