Skip to main content
Practice

Hex Code

Hex is short for hexadecimal, which is a way to represent color values in base-16.


Basic Structure​

A hex code starts with the # symbol, followed by six hexadecimal characters (0-9, A-F).

Examples:

  • #FFFFFF → white
  • #000000 → black
  • #FF0000 → red

Color Composition​

The six characters of a hex code are grouped into pairs, each representing red (R), green (G), and blue (B) respectively.

For example, in the hex code #FF5733:

  • FF represents the intensity of the red color.

  • 57 represents the intensity of the green color.

  • 33 represents the intensity of the blue color.


Usage​

You can use hex codes in CSS to specify the color of an element.

div {
  background-color: #ff5733;
}

The above code sets the background color of the div element to #FF5733.


Short Hex Code​

Sometimes, you can use a three-character hex code to represent colors. This is useful when each color component has the same value.

Examples:

  • #FFF → #FFFFFF (white)
  • #000 → #000000 (black)

Follow the highlighted parts of the code as you input it.

Want to learn more?

Join CodeFriends Plus membership or enroll in a course to start your journey.