← Journey PHASE 5b — Design system: client design system + Penpot bidirectional

Penpot Pattern Extract Workflow

n8npenpotdesign-systemautomation

Photo by Olga Kovalski on Unsplash

The second of three Penpot bidirectional n8n workflows is live. Pattern extraction pulls reusable component structures out of Penpot frames and stages them for template iteration.

The “Penpot Pattern Extract” workflow is wired and running. This is the second of three bidirectional workflows in Phase 5b — sitting between the token sync that shipped last cycle and the template iteration workflow still on the board.

What it does: triggers on a Penpot webhook, walks the frame tree via REST, identifies repeated component structures by shape name and nesting depth, then writes a normalised pattern manifest to the repo. No manual inspection of the Penpot file required after the initial frame is set up correctly.

Removed
Added
  • n8n workflow: penpot-pattern-extract.json
■ dani-brain/n8n-workflows
├─ penpot-token-sync.json Workflow 1 — token sync (live)
├─ penpot-pattern-extract.json new Workflow 2 — pattern extract (live)
└─ penpot-component-sync.json Workflow 3 — component sync (live)

The Figma Dev seat option is still deferred. The Penpot REST API covers what’s needed for pattern extraction without the additional spend.

What this unblocks: The pattern manifest is the direct input for the Template Iteration workflow (task #8). With both token sync and pattern extract live, workflow 3 has everything it needs to start generating iterable design scaffolds without re-querying Penpot on each run.