xCss

Saturate

Increases the saturation on the specified color, by a specified increment.

Usage

$saturate (color1, percentage)
Saturate color1 by the specified percentage (-100% to 100%).

Demonstration

Saturates red (#f00), in increments from -100% to +100%.
e.g. $saturate (#f00, -100%)

  • -100%
  • -90%
  • -80%
  • -70%
  • -60%
  • -50%
  • -40%
  • -30%
  • -20%
  • -10%
  • 0%
  • 10%
  • 20%
  • 30%
  • 40%
  • 50%
  • 60%
  • 70%
  • 80%
  • 90%
  • 100%

View xCss File

Saturates dark blue (#007), in increments from -100% to +100%.
e.g. $saturate (#007, -100%)

  • -100%
  • -90%
  • -80%
  • -70%
  • -60%
  • -50%
  • -40%
  • -30%
  • -20%
  • -10%
  • 0%
  • 10%
  • 20%
  • 30%
  • 40%
  • 50%
  • 60%
  • 70%
  • 80%
  • 90%
  • 100%

View xCss File