Background Color Code For Html Page

5 min read Jul 03, 2024
Background Color Code For Html Page

Background Color Code for HTML Page

The background color of an HTML page can be set using the background-color property in CSS. This property can be applied to the <body> tag or any other HTML element to change its background color.

Here are the different ways to set the background color:

1. Using Color Names:

You can use predefined color names in CSS to set the background color.







  

This is a heading

This is a paragraph.

This code will set the background color of the entire page to light blue. Here are some other common color names:

  • Red
  • Green
  • Blue
  • Yellow
  • Black
  • White
  • Pink
  • Orange
  • Purple

2. Using Hexadecimal Color Codes:

Hexadecimal color codes are the most common way to represent colors in web design. They consist of six characters preceded by a hash symbol (#). The first two characters represent the amount of red, the next two represent green, and the last two represent blue.







  

This is a heading

This is a paragraph.

This code will set the background color to a light gray.

3. Using RGB Color Values:

RGB color values use three numbers, each representing the intensity of red, green, and blue. The values range from 0 to 255.







  

This is a heading

This is a paragraph.

This code will set the background color to orange.

4. Using HSL Color Values:

HSL color values represent color using hue, saturation, and lightness. Hue refers to the color on the color wheel, saturation represents the intensity of the color, and lightness represents how light or dark the color is.







  

This is a heading

This is a paragraph.

This code will set the background color to red.

5. Using a Color Picker:

You can use online color pickers to find the hexadecimal, RGB, or HSL values for the color you want to use. Many code editors also have built-in color pickers.

6. Setting Background Color for Individual Elements:

You can apply the background-color property to any HTML element, not just the <body> tag. For example:







  

This is a heading

This is a paragraph.

This code will set the background color of the <h1> element to light gray.

Experiment with different colors and color codes to create visually appealing web pages. Remember to choose colors that are complementary and easy on the eyes!

Related Post


Latest Posts