How to Express RGB Colors as a Percentage

How to Express RGB Colors as a Percentage thumbnail
Colors are given in RGB value on the web.

On a web page, colors are displayed in RGB values, that is, by varying amounts of red, green and blue. All colors on the web are made from variations in the amount of red, green and blue assigned to any color. There are several ways to express this amount, one of which is with a percentage. Here is how.

Things You'll Need

  • A web page
  • A style sheet
Show More

Instructions

    • 1

      The RBG colors are normally given in a CSS rule in a style sheet for a particular web page. The syntax is
      rgb (color).

    • 2

      In the parentheses where the color values are given, use three comma-separated percentages: one for red, one for green and one for blue. Here, for example, is the value for white:
      rgb(100%,100%,100%)

    • 3

      To use this color notation in a CSS rule, give the selector, then state the rgb value for the color property of the selector. Here's an example of a CSS rule that would create a red color for an h2 selector:
      h2 {color: rgb(100%,0%,0%);}

    • 4

      Here are some additional color values in percentages:
      rgb(0%,0%,0%) black
      rgb(100%,40%,0%) orange
      rgb(100%,100%,0%) yellow
      rgb(0%,50%,0%) green
      rgb(0%,0%,100%) blue
      rgb(0%,100%,100%) aqua
      rgb(50%,50%,50%) gray
      rgb(0%,100%,0%) lime
      rgb(50%,0%,50%) purple

Tips & Warnings

  • Computers and browsers that use CSS understand this method of displaying colors.

Related Searches:

Resources

Comments

  • M. J. Mewes Apr 05, 2010
    Good tips. If you don't know how to count in base 16, using percentages is a good work-around for hex color codes.

You May Also Like

Related Ads

Featured