scss gradient mixin

1/* Mixin to create vertical, horizontal or radial gradient */
2@mixin gradient($start-color, $end-color, $orientation) {
3  background: $start-color;
4  @if $orientation == 'vertical' { 
5    /* Vertical gradient */
6    background: linear-gradient(to bottom, $start-color, $end-color);
7  } @else if $orientation == 'horizontal' {  
8    /* Horizontal gradient */
9    background: linear-gradient(to right, $start-color, $end-color);
10  } @else {  
11    /* Radial gradient */
12    background: radial-gradient(ellipse at center, $start-color, $end-color);
13  }
14}
15
16/* Usage */
17.gradient {
18  @include gradient(#07c, #06f, vertical);
19}