Mikkel Manniche
Dansk English Deutsch

Claude Code skill

design-bake-off

Three agents each build a complete landing page or front page from their own sharp idea. You see them side by side, pick one, and a fourth agent builds it into your app.

  • Claude Code skill
  • MIT licence
  • Needs Node.js

macOS and Linux

git clone https://github.com/manniche-labs/ui.git ~/manniche-labs-ui
ln -s ~/manniche-labs-ui/skills/design-bake-off ~/.claude/skills/design-bake-off

Windows (PowerShell)

git clone https://github.com/manniche-labs/ui.git "$env:USERPROFILE\manniche-labs-ui"
New-Item -ItemType Junction -Path "$env:USERPROFILE\.claude\skills\design-bake-off" -Target "$env:USERPROFILE\manniche-labs-ui\skills\design-bake-off"

Ask Claude Code for “a design bake-off for the front page”, or type /design-bake-off.

How a round goes

  1. Brief

    The skill reads your app and writes a short brief: who the page is for, what it should get them to do, and what must not be said.

  2. Three entries

    Three agents work at once, each from its own metaphor. Each entry is a finished page with real effects, not a sketch.

  3. You pick

    You see the three entries and pick one, or ask for another round.

  4. The port

    An agent builds the chosen entry into your app with your own colours and components. In React and shadcn it uses Manniche UI.

The rules

  • No invented numbers or testimonials.
  • No generic AI look.
  • One signature effect per section.
  • Effects in plain JS and CSS, so they work in any stack.