Generated by SassMeister.com.

SassMeister-input-HTML.html

<div class="b"></div>

SassMeister-input.scss

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

@function shadowGridBuilder($no,$x,$y,$color) {
  $init: $x $y 0 0;
  @for $i from 1 through $no {
    @if $i > 1 {
      $init: $init + $color+ ', ' + ((($x * $i) + (($x * $i) - $x)) $y 0 0);
    }
  }
  @return unquote($init + ' ' + $color);
}

@function build($no,$x,$y,$color) {
  $init: '';
  $str: '';
  @for $i from 0 through $no {
    @if $i > 0 {
      $str: shadowGridBuilder($no,$x,((($x * $i) + (($x * $i) - $x))), darken($color,10%));
      @if $i < $no {
        $str: $str + ',';
      }
      $init: $init + ' ' + $str;
    }
  }
  
  @return unquote($init);
}


.b {
  width: 4px;
  height: 4px;
  box-shadow: build(16,4px,4px,#ff44dd);
}

SassMeister-output.css

.b {
  width: 4px;
  height: 4px;
  box-shadow:  4px 4px 0 0#ff11d4, 12px 4px 0 0#ff11d4, 20px 4px 0 0#ff11d4, 28px 4px 0 0#ff11d4, 36px 4px 0 0#ff11d4, 44px 4px 0 0#ff11d4, 52px 4px 0 0#ff11d4, 60px 4px 0 0#ff11d4, 68px 4px 0 0#ff11d4, 76px 4px 0 0#ff11d4, 84px 4px 0 0#ff11d4, 92px 4px 0 0#ff11d4, 100px 4px 0 0#ff11d4, 108px 4px 0 0#ff11d4, 116px 4px 0 0#ff11d4, 124px 4px 0 0 #ff11d4, 4px 12px 0 0#ff11d4, 12px 12px 0 0#ff11d4, 20px 12px 0 0#ff11d4, 28px 12px 0 0#ff11d4, 36px 12px 0 0#ff11d4, 44px 12px 0 0#ff11d4, 52px 12px 0 0#ff11d4, 60px 12px 0 0#ff11d4, 68px 12px 0 0#ff11d4, 76px 12px 0 0#ff11d4, 84px 12px 0 0#ff11d4, 92px 12px 0 0#ff11d4, 100px 12px 0 0#ff11d4, 108px 12px 0 0#ff11d4, 116px 12px 0 0#ff11d4, 124px 12px 0 0 #ff11d4, 4px 20px 0 0#ff11d4, 12px 20px 0 0#ff11d4, 20px 20px 0 0#ff11d4, 28px 20px 0 0#ff11d4, 36px 20px 0 0#ff11d4, 44px 20px 0 0#ff11d4, 52px 20px 0 0#ff11d4, 60px 20px 0 0#ff11d4, 68px 20px 0 0#ff11d4, 76px 20px 0 0#ff11d4, 84px 20px 0 0#ff11d4, 92px 20px 0 0#ff11d4, 100px 20px 0 0#ff11d4, 108px 20px 0 0#ff11d4, 116px 20px 0 0#ff11d4, 124px 20px 0 0 #ff11d4, 4px 28px 0 0#ff11d4, 12px 28px 0 0#ff11d4, 20px 28px 0 0#ff11d4, 28px 28px 0 0#ff11d4, 36px 28px 0 0#ff11d4, 44px 28px 0 0#ff11d4, 52px 28px 0 0#ff11d4, 60px 28px 0 0#ff11d4, 68px 28px 0 0#ff11d4, 76px 28px 0 0#ff11d4, 84px 28px 0 0#ff11d4, 92px 28px 0 0#ff11d4, 100px 28px 0 0#ff11d4, 108px 28px 0 0#ff11d4, 116px 28px 0 0#ff11d4, 124px 28px 0 0 #ff11d4, 4px 36px 0 0#ff11d4, 12px 36px 0 0#ff11d4, 20px 36px 0 0#ff11d4, 28px 36px 0 0#ff11d4, 36px 36px 0 0#ff11d4, 44px 36px 0 0#ff11d4, 52px 36px 0 0#ff11d4, 60px 36px 0 0#ff11d4, 68px 36px 0 0#ff11d4, 76px 36px 0 0#ff11d4, 84px 36px 0 0#ff11d4, 92px 36px 0 0#ff11d4, 100px 36px 0 0#ff11d4, 108px 36px 0 0#ff11d4, 116px 36px 0 0#ff11d4, 124px 36px 0 0 #ff11d4, 4px 44px 0 0#ff11d4, 12px 44px 0 0#ff11d4, 20px 44px 0 0#ff11d4, 28px 44px 0 0#ff11d4, 36px 44px 0 0#ff11d4, 44px 44px 0 0#ff11d4, 52px 44px 0 0#ff11d4, 60px 44px 0 0#ff11d4, 68px 44px 0 0#ff11d4, 76px 44px 0 0#ff11d4, 84px 44px 0 0#ff11d4, 92px 44px 0 0#ff11d4, 100px 44px 0 0#ff11d4, 108px 44px 0 0#ff11d4, 116px 44px 0 0#ff11d4, 124px 44px 0 0 #ff11d4, 4px 52px 0 0#ff11d4, 12px 52px 0 0#ff11d4, 20px 52px 0 0#ff11d4, 28px 52px 0 0#ff11d4, 36px 52px 0 0#ff11d4, 44px 52px 0 0#ff11d4, 52px 52px 0 0#ff11d4, 60px 52px 0 0#ff11d4, 68px 52px 0 0#ff11d4, 76px 52px 0 0#ff11d4, 84px 52px 0 0#ff11d4, 92px 52px 0 0#ff11d4, 100px 52px 0 0#ff11d4, 108px 52px 0 0#ff11d4, 116px 52px 0 0#ff11d4, 124px 52px 0 0 #ff11d4, 4px 60px 0 0#ff11d4, 12px 60px 0 0#ff11d4, 20px 60px 0 0#ff11d4, 28px 60px 0 0#ff11d4, 36px 60px 0 0#ff11d4, 44px 60px 0 0#ff11d4, 52px 60px 0 0#ff11d4, 60px 60px 0 0#ff11d4, 68px 60px 0 0#ff11d4, 76px 60px 0 0#ff11d4, 84px 60px 0 0#ff11d4, 92px 60px 0 0#ff11d4, 100px 60px 0 0#ff11d4, 108px 60px 0 0#ff11d4, 116px 60px 0 0#ff11d4, 124px 60px 0 0 #ff11d4, 4px 68px 0 0#ff11d4, 12px 68px 0 0#ff11d4, 20px 68px 0 0#ff11d4, 28px 68px 0 0#ff11d4, 36px 68px 0 0#ff11d4, 44px 68px 0 0#ff11d4, 52px 68px 0 0#ff11d4, 60px 68px 0 0#ff11d4, 68px 68px 0 0#ff11d4, 76px 68px 0 0#ff11d4, 84px 68px 0 0#ff11d4, 92px 68px 0 0#ff11d4, 100px 68px 0 0#ff11d4, 108px 68px 0 0#ff11d4, 116px 68px 0 0#ff11d4, 124px 68px 0 0 #ff11d4, 4px 76px 0 0#ff11d4, 12px 76px 0 0#ff11d4, 20px 76px 0 0#ff11d4, 28px 76px 0 0#ff11d4, 36px 76px 0 0#ff11d4, 44px 76px 0 0#ff11d4, 52px 76px 0 0#ff11d4, 60px 76px 0 0#ff11d4, 68px 76px 0 0#ff11d4, 76px 76px 0 0#ff11d4, 84px 76px 0 0#ff11d4, 92px 76px 0 0#ff11d4, 100px 76px 0 0#ff11d4, 108px 76px 0 0#ff11d4, 116px 76px 0 0#ff11d4, 124px 76px 0 0 #ff11d4, 4px 84px 0 0#ff11d4, 12px 84px 0 0#ff11d4, 20px 84px 0 0#ff11d4, 28px 84px 0 0#ff11d4, 36px 84px 0 0#ff11d4, 44px 84px 0 0#ff11d4, 52px 84px 0 0#ff11d4, 60px 84px 0 0#ff11d4, 68px 84px 0 0#ff11d4, 76px 84px 0 0#ff11d4, 84px 84px 0 0#ff11d4, 92px 84px 0 0#ff11d4, 100px 84px 0 0#ff11d4, 108px 84px 0 0#ff11d4, 116px 84px 0 0#ff11d4, 124px 84px 0 0 #ff11d4, 4px 92px 0 0#ff11d4, 12px 92px 0 0#ff11d4, 20px 92px 0 0#ff11d4, 28px 92px 0 0#ff11d4, 36px 92px 0 0#ff11d4, 44px 92px 0 0#ff11d4, 52px 92px 0 0#ff11d4, 60px 92px 0 0#ff11d4, 68px 92px 0 0#ff11d4, 76px 92px 0 0#ff11d4, 84px 92px 0 0#ff11d4, 92px 92px 0 0#ff11d4, 100px 92px 0 0#ff11d4, 108px 92px 0 0#ff11d4, 116px 92px 0 0#ff11d4, 124px 92px 0 0 #ff11d4, 4px 100px 0 0#ff11d4, 12px 100px 0 0#ff11d4, 20px 100px 0 0#ff11d4, 28px 100px 0 0#ff11d4, 36px 100px 0 0#ff11d4, 44px 100px 0 0#ff11d4, 52px 100px 0 0#ff11d4, 60px 100px 0 0#ff11d4, 68px 100px 0 0#ff11d4, 76px 100px 0 0#ff11d4, 84px 100px 0 0#ff11d4, 92px 100px 0 0#ff11d4, 100px 100px 0 0#ff11d4, 108px 100px 0 0#ff11d4, 116px 100px 0 0#ff11d4, 124px 100px 0 0 #ff11d4, 4px 108px 0 0#ff11d4, 12px 108px 0 0#ff11d4, 20px 108px 0 0#ff11d4, 28px 108px 0 0#ff11d4, 36px 108px 0 0#ff11d4, 44px 108px 0 0#ff11d4, 52px 108px 0 0#ff11d4, 60px 108px 0 0#ff11d4, 68px 108px 0 0#ff11d4, 76px 108px 0 0#ff11d4, 84px 108px 0 0#ff11d4, 92px 108px 0 0#ff11d4, 100px 108px 0 0#ff11d4, 108px 108px 0 0#ff11d4, 116px 108px 0 0#ff11d4, 124px 108px 0 0 #ff11d4, 4px 116px 0 0#ff11d4, 12px 116px 0 0#ff11d4, 20px 116px 0 0#ff11d4, 28px 116px 0 0#ff11d4, 36px 116px 0 0#ff11d4, 44px 116px 0 0#ff11d4, 52px 116px 0 0#ff11d4, 60px 116px 0 0#ff11d4, 68px 116px 0 0#ff11d4, 76px 116px 0 0#ff11d4, 84px 116px 0 0#ff11d4, 92px 116px 0 0#ff11d4, 100px 116px 0 0#ff11d4, 108px 116px 0 0#ff11d4, 116px 116px 0 0#ff11d4, 124px 116px 0 0 #ff11d4, 4px 124px 0 0#ff11d4, 12px 124px 0 0#ff11d4, 20px 124px 0 0#ff11d4, 28px 124px 0 0#ff11d4, 36px 124px 0 0#ff11d4, 44px 124px 0 0#ff11d4, 52px 124px 0 0#ff11d4, 60px 124px 0 0#ff11d4, 68px 124px 0 0#ff11d4, 76px 124px 0 0#ff11d4, 84px 124px 0 0#ff11d4, 92px 124px 0 0#ff11d4, 100px 124px 0 0#ff11d4, 108px 124px 0 0#ff11d4, 116px 124px 0 0#ff11d4, 124px 124px 0 0 #ff11d4;
}

SassMeister-rendered.html

<div class="b"></div>