Open as new workspace
Alternating colors experiment 2 by Ryan

Alternating colors experiment 2

View source Pathogen · 91 lines
define ViewBox(0, 0, 1820, 600);
define default PathLayer('base') ${
  fill: #fff;
  stroke: none;
}
let { width, height } = viewbox;
rect(0, 0, width, height);

let mainPLFillColor = oklch(0.9792 0.1035 107.6 / 0.075).hueShift(0.7pi);
let shadowColor = oklch(0.6573 0.2590 356.8 / 0.28).hueShift(-0.40pi).saturate(120%);
let baseMainStyles = ${
  fill: mainPLFillColor;
  stroke: mainPLFillColor.darken(84%).alpha(64%);
  stroke-width: 0.3;
  filter: drop-shadow(0px 0px 8px shadowColor);
};
let mainPathLayer = PathLayer('main-path-layer') << baseMainStyles;

let fontFamily = 'Ewert';
@font fontFamily;
let glyphFontColor = oklch(0.6291 0.2562 26.8);
let glyphStyles = ${
  fill: glyphFontColor.alpha(28%);
  font-family: fontFamily;
  font-size: 32;
  font-weight: 400;
  stroke: glyphFontColor.alpha(72%);
  stroke-width: 2;
};

let layerCounter = 1;
let glyphs = PathBlock.fromGlyph(`Unlikely & ? @ Persuasion`, glyphStyles);
for ([glyph, gIndex] in glyphs) {
  // Capture generated contours so that they can later be added to a higher
  //   z-index layer
  let contourSet = [];
  let conScale = randomRange(0.95, 4);

  let baseGlyphColor = mainPLFillColor.hueShift(0pi);
  let baseGlyphShadowColor = shadowColor.hueShift(0pi);
  if (calc(gIndex % 2) == 0) {
    baseGlyphColor = baseGlyphColor.hueShift(0.33pi);
    baseGlyphShadowColor = baseGlyphShadowColor.hueShift(0.95pi).lighten(20%);
  }
  
  let contours = glyph.contours.map() {|con|
    return con.fillet(1.6).scale(conScale, conScale).rotateAtVertexIndex(0, randomRange(-0.25pi, 0.25pi));
  };
  
  for ([contour, cIndex] in contours) {
    let leftOffset = calc(220 + gIndex * 48);
    contourSet.push({
      contour,
      leftOffset,
    });

    for (offsetBase in 1..42) {
      let offsetBase = calc(offsetBase * 1.25 + 5);
      let halo = contour.variableOffset() {|vo, cpb|
        let timeMax = 17;
        for (time in 1..timeMax) {
          let offset = randomRange(calc(offsetBase - 2.8), calc(offsetBase + 2.8));
          vo.stop(calc(time / timeMax), offset, CurveContinuity.G2);
        }
      };
      let pl = PathLayer(`pl-${layerCounter}`) << baseMainStyles << ${
        fill: baseGlyphColor.hueShift(calc(offsetBase * 0.075pi));
        stroke: baseGlyphColor.darken(randomRange(0.32, 0.72)).alpha(42%);
        stroke-width: randomRange(0.075, 0.975);
        filter: drop-shadow(0px 0px 8px baseGlyphShadowColor);
      };
      layerCounter = layerCounter + 1;
      pl.apply {
        halo.drawTo(leftOffset, 260);
        z
      }
    }
  }


  let glyphLayer = PathLayer(`gl-${gIndex}`) << glyphStyles << ${
    filter: `blur(${randomRange(1.8, 4.2)}px)`;
  };
  glyphLayer.apply {
    for (contourRef in contourSet) {
      let { contour, leftOffset } = contourRef;
      contour.drawTo(leftOffset, 260);
    }
  }
}