CSS color representation, css color

Source: Internet
Author: User
Tags color representation hex code

CSS color representation, css color

You may wonder why we use six digits to represent a color instead of one or two. The answer is that we can use six digits to provide us with a huge number of color changes.

How many colors are there? 16 values (0 ~ F) and 6 positions mean we have 16 power 6, or more than 16 million possible colors.

The Hex code follows red-green-blue (red-green-blue), orrgbFormat. The first two digits in hex code indicate the numbers in red, the third and fourth digits indicate the numbers in green, and the fifth and sixth digits represent the numbers in blue.

So to get an absolute pure red color, you only need to use it in the first and second places.F(Maximum possible value), and used in the third, fourth, fifth, and sixth places0(Minimum possible value ).

The following are some common colors:

Apply the hex code value to background-color:

#FF0000(#F00You can setbodyThe background color of the element is set to red;

#00FF00You can setbodyThe background color of the element is set to green;

#0000FFYou can setbodyThe background color of the element is set to blue;

#FFA500You can setbodySet the background color of the element to orange;

#808080You can setbodyThe background color of the element is set to Gray;

#111111You can setbodyThe background color of the element is set to dark gray.

Another way to represent the color in CSS is to usergbValue.

The black RGB value looks like the following:

rgb(0, 0, 0)

The white RGB value looks like the following:

rgb(255, 255, 255)

Usergb, You specify the brightness of each color by a number between 0 and 255, instead of using six hexadecimal numbers like hex code.

If you do an arithmetic, 16 multiplied by 16 has a total of 256 values, so the count starts from scratch.rgb, Which has the same number of possible values as hex code.

Red RGB values:rgb(255, 0, 0);

Green RGB values:rgb(0, 255, 0);

Blue RGB values:rgb(0, 0, 255);

Orange RGB values:rgb(255, 165, 0);

 

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.