Generated by SassMeister.com.

all-gradients-output.css

.selector2 {
  background: right;
  background: -webkit-linear-gradient(10px, right, #FC913A 0%, #FF4E50 100%);
  background: linear-gradient(10px, right, #FC913A 0%, #FF4E50 100%);
  background: -webkit-linear-gradient(10px, right, #FC913A 0%, #FF4E50 100%);
  background: linear-gradient(10px, right, #FC913A 0%, #FF4E50 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  border: 1px solid transparent;
  -moz-border-image: -moz-linear-gradient(10px, right, #FC913A 0%, #FF4E50 100%);
  -webkit-border-image: -webkit-linear-gradient(10px, right, #FC913A 0%, #FF4E50 100%);
  border-image: linear-gradient(10px, right, #FC913A 0%, #FF4E50 100%);
  border-image-slice: 1;
}

all-gradients.scss

// ----
// Sass (v3.4.21)
// Compass (v1.0.3)
// ----

// Background
@mixin linear-gradient($direction, $color-stops...) {
  background: nth(nth($color-stops, 1), 1);
  background: -webkit-linear-gradient($direction, $color-stops);
  background: linear-gradient($direction, $color-stops);
}


// Border
@mixin border-gradient($direction, $color-stops...) {
	border: 1px solid transparent;
  -moz-border-image: -moz-linear-gradient($direction, $color-stops);
  -webkit-border-image: -webkit-linear-gradient($direction, $color-stops);
  border-image: linear-gradient($direction, $color-stops);
  border-image-slice: 1;
}

// Text
@mixin txt-gradient($direction, $color-stops...) {
  background: -webkit-linear-gradient($direction, $color-stops);
  background: linear-gradient($direction, $color-stops);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}


.selector2 {
  @include linear-gradient(10px, right, #FC913A 0%, #FF4E50 100%);
  @include txt-gradient(10px, right, #FC913A 0%, #FF4E50 100%);
  @include border-gradient(10px, right, #FC913A 0%, #FF4E50 100%);
}