Guilloché

var backgroundH = intVariable('backgroundH', 0, 360);
var backgroundS = intVariable('backgroundS', 0, 100);
var backgroundL = intVariable('backgroundL', 0, 100);

var scale = intVariable('scale', 50, 200);
var steps = intVariable('steps', 300, 3000);
var multi = intVariable('multi', 1, 20);
var major = intVariable('major', 0, 100);
var minor = intVariable('minor', 1, 50);
var radius = intVariable('radius', 0, 100);
var opacity = intVariable('opacity', 50, 100);

var backgroundColor = Snap.hsl(backgroundH, backgroundS, backgroundL);
var foregroundColor = Snap.hsl(backgroundH, backgroundS, backgroundL + 30);

s.rect(0, 0, width, height).attr({fill: backgroundColor})

// adapted from https://github.com/willwharton/guilloche

var _steps = steps; // Divide a circle this many times
var _R = major; // The major ripple
var _rr = minor / 100; // The minor ripple
var _p = radius; // Radius type effect
var _m = multi / 4; // Angle multiplier
var _amplitude = scale / 10; // Scale of final drawing
var section_length = 1; // Number of sections for each line
var deg2rad = Math.PI / 180; // Factor to convert degs to radians
var path = [];
var l;
var x, y, ox, oy;
var sl = 0;
var theta = 0;
var thetaStep = 2 * Math.PI / _steps;
var ss = (_R + _rr) / _rr;
var rR = _rr + _R;
var rp = _rr + _p;

for (var t = 0; t <= _steps; t++) {
  x = rR * Math.cos(_m * theta) + rp * Math.cos(ss * _m * theta);
  y = rR * Math.sin(_m * theta) + rp * Math.sin(ss * _m * theta);

  x *= _amplitude;
  y *= _amplitude;

  if (sl == 0) {
    if (t == 0) {
      path.push(x, y);
    } else {
      path.push(ox, oy);
      path.push(x, y);
    }
    s.polyline(path).attr({
      fill: 'none',
      stroke: foregroundColor,
      strokeOpacity: opacity / 100,
    });
    path = [];
  } else {
    path.push(x, y);
    s.polyline(path).attr({
      fill: 'none',
      stroke: foregroundColor,
      strokeOpacity: opacity / 100,
    });
    path = [];
  }

  ox = x;
  oy = y;
  sl++;
  theta += thetaStep;

  if (sl == section_length) sl = 0;
}