How it works

  • Only the outer outline and the two largest orange curls are read from M3Brand's own Silk file and traced with stroke-dasharray and pathLength="1" (stroke-dashoffset 1 → 0); each curl draws only its own inner edge, as one line in one direction, since the outline already traces the rim it shares with the 3's holes; the inner contours and small pieces are not traced and appear with the fill.
  • Sequential: the outline traces up from the M stem, then curl 1, a short gap, curl 2; the fill fades in after the last stroke while the outline fades out.
  • Mirrored: the outline and both curls trace together, the curls from the other end (offset −1 → 0); the fill follows the outline.
  • Speed follows Logo Pen Draw: outline 4.5 / 2.8 / 1.4 s, each curl 0.4 of that, fill 1.2 / 0.8 / 0.5 s.
  • The fill is the static mark drawn once to an image (Mono: recoloured once to the theme primary, keeping its luminance), so only stroke offsets and opacity animate.