Skip to content

Instantly share code, notes, and snippets.

@MarcoWorms

MarcoWorms/hsl-cheatsheet.md

Created June 27, 2022 15:11
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save MarcoWorms/2d254f830045e1e189df808e5346017c to your computer and use it in GitHub Desktop.
Save MarcoWorms/2d254f830045e1e189df808e5346017c to your computer and use it in GitHub Desktop.
Download ZIP
Raw
hsl-cheatsheet.md

Images are from https://www.refactoringui.com/ book

Hue is measured in degrees

  • 0° is red
  • 120° is green
  • 240° is blue.

hue examples

Saturation is how colorful or vivid a color looks

  • 0% saturation is grey (no color)
  • 100% saturation is vibrant and intense.

saturation examples

Lightness measures how close a color is to black or white

  • 0% lightness is pure black
  • 50% lightness is a pure color at the given hue.
  • 100% lightness is pure white

lightness examples

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment