designbrief

A library of rich design direction files — one per UI style — that provide guardrails for building tasteful, consistent interfaces without prescribing exact values.

How It Works

Each style is a standalone markdown file in styles/ that defines the design DNA of a visual direction: typography families, color theory, spacing philosophy, border/shadow characteristics, layout principles, component behavior, and implementation guidance.

These are guardrails, not templates. They define what kind of font, color, spacing — not the exact values. The developer (or AI) makes specific choices within the style's constraints.

When This Skill Activates

Use this skill when the user:

• Asks to build any UI, page, component, or app
• Mentions a specific design style by name
• Asks for style recommendations or comparisons
• Wants to change the visual direction of an existing project

Workflow