In this tutorial, I’m going to show you how-to create Sass mixins for linear gradient backgrounds.
Top to Bottom
// Background Gradient: Top to Bottom
@mixin bg-gradient-t2b($start-colour, $end-colour) {
background-color: $start-colour;
background-image: -webkit-gradient(linear, left top, left bottom, from($start-colour), to($end-colour));
background-image: -webkit-linear-gradient(top, $start-colour, $end-colour);
background-image: -moz-linear-gradient(top,
