HTML

HTML Colors

The HTML colors are predefined color codes or names that determine the color of the text, background, text borders, etc. All the HTML colors have a specific name, hexadecimal codes, and RGB, RGBA, HSL, and HSLA values that create the various visual styles as per requirement.

<h3 style="color: red;">HTML Colors</h3>

<p style="background-color: #00ff00;">Green Background</p>
    
<div style="border: 2px solid rgb(0, 0, 255);">Blue Border</div>

Color Names

You can specify a color in an HTML document by writing the color name.

<h3 style="color: blue;">HTML Color Names</h3>

Background Color

In an HTML document, you can easily set the background to any color.

<div style="background-color: lightblue;">
    <h3>HTML Background Color</h3>
    
    <p>The background color is set using the 
        <code>background-color</code> 
        property in the 
        <code>&lt;body&gt;</code> tag.
    </p>
</div>

Text Color

The color of the text can also be changed to required color.

<h3 style="color: red;">HTML Text Color</h3>

<p style="color: green;">This paragraph has Green Text</p>

<p style="color: orange;">This is Orange Text</p>

Border Colors

Similarly, the borders can also be colored into any color in the HTML.

<div style="border: 2px solid red; 
    padding: 10px; 
    margin-bottom: 10px;">
    This div has a Red Border
</div>

<div style="border: 3px solid blue; 
    padding: 10px; 
    margin-bottom: 10px;">
    This div has a Blue Border
</div>

<div style="border: 4px solid green; 
    padding: 10px;">
    This div has a Green Border
</div>

HTML Color Values

In HTML, the colors are specified with hexadecimal triplet values. These include the basic colors red, green, and blue. You can create any color using these primary colors. To create colors in HTML RGB, RGBA, HEX, HSL, and HSLA values are used.

HEX: #ff5733
RGB: rgb(0, 255, 0)
RGBA: rgba(0, 0, 255, 0.5)
HSL: hsl(120, 100%, 75%)
HSLA: hsla(240, 100%, 50%, 0.7)

These color codes are used to change text color, color of the background, border, tables, and other elements of the webpage.

<p style="color: #ff5733;">HEX color.</p>

<p style="color: rgb(0, 255, 0);">RGB color</p>

<p style="color: rgba(0, 0, 255, 0.5);">RGBA color.</p>

<p style="color: hsl(120, 100%, 75%);">HSL color.</p>

<p style="color: hsla(240, 100%, 50%, 0.7);">HSLA color.</p>

You can use a reference color code chart to create a particular color. Every color has a unique code and can be used in HTML easily. For red color, you will use the code red in HTML and CSS, instead of its code #FF0000 because HTML supports adding colors using their names.