Generated by SassMeister.com.

SassMeister-input.scss

// ----
// Sass (v3.3.0.rc.2)
// Compass (v1.0.0.alpha.17)
// ----

@import "compass";

// Private function for custom stops
// ------------------------------------------------------------
// @param $colors: list of color + associated stop
//     ex: (red 10%, blue 50%, green 65%)
// ------------------------------------------------------------
// @return list to be used as a gradient

@function _stripes-custom-stops($colors) {
  $gradients: ();
  
  @for $i from 1 to length($colors) {
    @if length(nth($colors, $i)) > 1 {
      $color: nth(nth($colors, $i), 1);
      $stop:  nth(nth($colors, $i), 2);

      $gradients: append($gradients, $color $stop, comma);
      @if $i < length($colors) {
        $gradients: append($gradients, nth(nth($colors, $i + 1), 1) $stop);
      }
    }
    
    @else {
      @warn '`#{nth($colors, $i)}` skipped because it is only one item long while it should be 2: (color, color-stop).';
    }
  }
  
  @return $gradients;
}

// Private function for random stops
// ------------------------------------------------------------
// @param $colors: list of color
//     ex: (red, blue, green)
// ------------------------------------------------------------
// @return two dimensional list

@function _stripes-random-stops($colors) {
  @if length(nth($colors, 1)) > 1 {
    @return _stripes-custom-stops($colors);
  }
  
  $last-random: 0;
  $gradients: ();
  
  @for $i from 1 to length($colors) {
    $random: random($last-random, 100) * 1%;
    $gradients: append($gradients, nth($colors, $i) $random, comma);
    @if $i < length($colors) {
      $gradients: append($gradients, nth(nth($colors, $i + 1), 1) $random);
    } 
    $last-random: $random;
  }
  
  @return $gradients;
}

// Private function for equal stops
// ------------------------------------------------------------
// @param $colors: list of color
//     ex: (red, blue, green)
// ------------------------------------------------------------
// @return two dimensional list

@function _stripes-equal-stops($colors) {
  $gradients: ();
  $stops: 100% / length($colors);
  
  // Loop through colors
  @for $i from 1 to length($colors) {
    $gradients: append($gradients, nth($colors, $i) $i * $stops, comma);
    @if $i < length($colors) {
      $gradients: append($gradients, nth($colors, $i + 1) $i * $stops);
    }
  }
  
  // Return gradient
  @return $gradients;
}

// Function turning a list of colors (and if specified stops)
// into a stripes gradient
// ------------------------------------------------------------
// @param $colors: list of color or color + color stop
//     ex: (red blue green) 
//     ex: (red 10%, blue 50%, green 65%)
// @param $direction: gradient direction in keyword or degrees
// @param $random: should color-stops be randomly generated
// ------------------------------------------------------------
// @return gradient

@function stripes($colors, $direction: 90deg, $random: false) {
  // If lonely color
  @if length($colors) == 1 { @return $colors; }
  
  // Else
  $type: if($random, 'random', if(length(nth($colors, 1)) > 1, 'custom', 'equal'));
  @return linear-gradient($direction, call('_stripes-#{$type}-stops', $colors));
}

html {
  height: 100%; 
  
  $equal-stops  : brown      red      orange      yellow      green      teal      blue;
  $custom-stops : brown 10%, red 34%, orange 46%, yellow 50%, green 57%, teal 75%, blue 86%;
  $direction    : 90deg;
  
  // Equal stops
  background: stripes($equal-stops, $direction);
  
  // Random stops
  // background: stripes($equal-stops, $direction, $random: true); 
  
  // Custom stops
  // background: stripes($custom-stops, $direction);
}

SassMeister-output.css

html {
  height: 100%;
  background: linear-gradient(90deg, #a52a2a 14.28571%, #ff0000 14.28571%, #ff0000 28.57143%, #ffa500 28.57143%, #ffa500 42.85714%, #ffff00 42.85714%, #ffff00 57.14286%, #008000 57.14286%, #008000 71.42857%, #008080 71.42857%, #008080 85.71429%, #0000ff 85.71429%);
}