HTML Color Picker

Use this HTML color picker to pick HTML colors for your website.




Pick Multiple Colors (optional)

Color 1: # ____
Color 2: # ____
Color 3: # ____

To pick up to 3 colors, click in the text field next to "Color 1:", then select a color from the color picker. Repeat for the other two fields.

More color schemes.

Using the HTML color picker:

  1. Click anywhere in the large square to pick a color. You can also use the slider on the right to change the hue.
  2. Once you're happy with the color, copy the hexadecimal value from the bottom field (the series of 6 digits/letters in bold (for example #FFFFFF). Alternatively, you can use the RGB values if you prefer (for example, 255,255,255).

Adding Colors to Your HTML Documents

Once you've picked your colors, you can apply the colors to your HTML documents or blog using simply CSS code.

The exact code you use will depend on the element that you are working with, however, the most common color-related properties are color, background-color, and probably to a lesser extent, the border property.

Below are some quick examples. You can find more information about HTML color here.

Text Color

To specify text color, you need to use color:{color code}, where {color code} is a color name, hex code, or decimal RGB value.

Source CodeResult

Sample text

Background Color

To specify background color, use the background-color property:

Source CodeResult

Sample text

Border Color

To specify border color, use the border property, along with the border width and style:

Source CodeResult

Sample text

Color Code Chart

Also check out the color code chart to see a chart containing the most common HTML colors.