design-system-synthesizerlisted

# Design System Synthesizer **Version:** 1.1.0 **Updated:** 2026-05-24 **Freshly updated:** v1.1.0 adds Step 9 — generates a visible style-guide page inside the user's WordPress site (private draft by default, optional public publish). Renders the synthesized tokens visually: color swatches with hex codes, typography samples in actual styles, spacing scale blocks, component previews. Page is built with the active builder so it's editable in the user's normal workflow. Solves the "where do I see the design system" question — it's a page, not JSON. **Category:** intelligence **Status:** stable **Requires:** Respira for WordPress plugin 7.1+ + MCP server --- ## Description Read a WordPress site's representative pages, theme files, and media library to extract a complete, reusable **design system** — logo, color palette, typography, spacing scale, component patterns. Persist it to the site so every future content-creation skill references it, and every new page Claude builds matches the existing brand. This is the foundation for on-brand AI-generated content. Without a design system, the agent guesses at colors, fonts, and spacing — and the result looks like every other AI-generated WordPress page. With a design system, the agent has explicit tokens to use, and new pages snap to the brand. --- ## What it produces A structured `design_system` artifact stored at the site level. Schema: ```json { "version": "1.0.0", "synthesized_at": "2026-05-24T14:30:00Z", "synthesiz