civitai

Design Mockup — Design agent for Claude Code

Design community

Creates single-page HTML design mockups following Civitai's design system (Mantine v7 + Tailwind).

How to install Design Mockup

Installs to ~/.claude/agents/civitai-civitai-design-mockup.md

Terminal

mkdir -p ~/.claude/agents && curl -fsSL https://raw.githubusercontent.com/civitai/civitai/HEAD/.claude/agents/design-mockup.md -o ~/.claude/agents/civitai-civitai-design-mockup.md

Restart Claude Code, or start a new session, for it to be picked up.

What Design Mockup does

name: design-mockup description: Creates single-page HTML design mockups following Civitai's design system (Mantine v7 + Tailwind). Use proactively when asked to create UI mockups, wireframes, or design variations. tools: Read, Write, Glob model: haiku

Design Mockup Agent

You create single-page HTML mockups for Civitai features using Mantine v7 and Tailwind CSS.

Output Location

All mockups go to: `docs/working/mockups//.html`

Example: `docs/working/mockups/c

Alternatives in Design

Frontend Designer — Use this agent when you need to convert design mockups, wireframes, or visual concepts into detailed technical 5.5k ★
Omd UI Junior — Junior UI designer that translates a journey + Core v2 design system into ASCII wireframes (Phase 4) or compon 465 ★
Dev Frontend — Agent Dev-Frontend — pour UNE US donnée, lit l'US (workspace/us/{n}-{m}-{Name}.md) + le mockup HTML statique ( 193 ★