Various Colors

Various Colors

F966e93db0fbaf3aa07f7df5fa136933?s=128

Keita Urashima

March 28, 2015
Tweet

Transcript

  1. 3.
  2. 4.
  3. 6.

    hsl(0deg, 40%, 30%) hsl(0deg, 60%, 30%) hsl(0deg, 100%, 50%) hsl(0deg,

    60%, 50%) hsl(0deg, 40%, 50%) hsl(0deg, 100%, 70%) hsl(0deg, 60%, 70%) hsl(0deg, 40%, 70%) hsl(0deg, 100%, 30%)
  4. 7.

    hsl(0deg, 80%, 50%) hsl(180deg, 80%, 50%) hsl(90deg, 80%, 50%) hsl(30deg,

    80%, 50%) hsl(120deg, 80%, 50%) hsl(210deg, 80%, 50%) hsl(60deg, 80%, 50%) hsl(150deg, 80%, 50%) hsl(240deg, 80%, 50%)
  5. 13.

    $ sass -i >> hue(rgb(12, 34, 56)) 210deg >> saturation(rgb(12,

    34, 56)) 64.70588% >> lightness(rgb(12, 34, 56)) 13.33333% Sass HSL Functions
  6. 14.

    >> adjust-hue(rgb(12, 34, 56), 30deg) #0c0c38 >> saturate(rgb(12, 34, 56),

    20%) #05223f >> desaturate(rgb(12, 34, 56), 20%) #132231 >> lighten(rgb(12, 34, 56), 10%) #153b62 >> darken(rgb(12, 34, 56), 10%) #03080e