Fireworks Design

fireworks-design

An open-source Claude Code workflow that replicates ClaudeDesign — fan out many distinct design directions, judge them like a panel, synthesize the best, and adversarially refine to a single world-class frontend page.

English · 简体中文

One-sentence pitch: Stop rolling the dice on a single model output. fireworks-design explores 6–8 independent aesthetics in parallel, scores each across 6 design dimensions, grafts the winners together, then critique-fix-loops the result until it's shippable.

📦 Install

In Claude Code, just say:
Install fireworks-design into this project — repo is yizhiyanhua-ai/fireworks-design.

Claude drops the workflow into .claude/workflows/ and adds a /fireworks-design slash command — done.

Prefer the shell?

🚀 Usage

Type the slash command, then your request:

Claude runs the workflow in the background (watch it live with /workflows) and hands you a finished final.html. Or just ask in plain language:
Use fireworks-design to build a landing page for a coffee shop. Save it to ~/design/coffee.

Tweak it conversationally — …explore 8 directions, refine 3 rounds, brand color #7c3aed.

What you get: a single self-contained final.html (plus the explored draft-*.html directions) and a summary of which aesthetic won and why.

Prefer to call it directly?

prompt and outputDir (absolute path) are required; variants (3–8), refineRounds, brand, and lenses are optional. Full reference in the Arguments section below.

✨ Featured outputs (效果解读)

14 real pages across totally different domains — all live on GitHub Pages · full table + deep-dives. Four highlights:

      🎬 LUMIÈRE — movie rating · Dark Premium

      🎵 NOVA · AURORA — album · Bold Editorial

      🎨 OBJECT & ECHO — studio · Bold Editorial

      ✈️ AZORES — travel · Bold…