1StopCoders

Code Examples and Industry News

SASS Gradient Background Mixin

SASS - Created by Casey Martin: 2014-05-16 17:01:00

$vendors: "-moz-", "-webkit-", "-o-", "";
$msvendors: "-ms-", "";

@mixin gradient($from, $to) {
  	background-color: $to;
	background: -webkit-gradient(linear, left top, left bottom, from($from), to($to));
	@each $vendor in $vendors {
		background: #{$vendor}linear-gradient(top,  $from, $to);
	}
  	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#{$from}', endColorstr='#{$to}');
}