Colors

Color Formats

Most common ways to represent colors in CSS:

Pros and Cons

Keywords

Pros

  • Good for education content
  • Easier to understand by reading

Cons

  • Not a way to tweak multiple shades of the same color
  • Not recommended to real in production applications

Hex Codes

A way to represent RGB colors with hexadecimal values

Cons

  • Pretty difficult to read

RGB

A way to represent RGB colors in a decimal system

Pros

  • Easier to read, not needing convertion

Cons

  • Not actually clear when looking in a color, on how to transform it, eg: saturation

HSL

By far the best format ✨

Pros

  • Easier to read, not needing convertion
  • First value depresents degrees
  • Second value represents saturation - how vibrant the color is
  • Third value represents lightness - how light or dark the color is

Transparency

Background colors

This is a paragraph with a highlighted section.