design-consultation

Generate a complete design system with typography, color, layout, and motion.

Updated Apr 8, 2026
One-click install
npx skills add https://github.com/sadie100/claude-dotfiles --skill design-consultation-sadie100
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: design-consultation
Source: https://github.com/sadie100/claude-dotfiles/tree/main/skills/design-consultation
Command: npx skills add https://github.com/sadie100/claude-dotfiles --skill design-consultation-sadie100

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires gbrain, design-system-generator, and includes scripts (resource) and assets (resource) components.

What problem does it solve?

This skill helps you create a complete design system for your project, including aesthetics, typography, color, layout, spacing, and motion, as well as generating font and color previews.

Core Features & Use Cases

  • Design System Creation: Propose and implement a complete design system based on your product's context and research.
  • Research Integration: Utilize existing design decisions and brand guidelines.
  • Interactive Proposal: Present the design system with a safe/risks breakdown, allowing for adjustments and risks exploration.
  • Visual Previews: Generate AI-rendered mockups or HTML preview pages of the design system applied to realistic screens.

Quick Start

Use the /design-consultation skill to generate a design system for your project.

Frequently Asked Questions about design-consultation

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I create a complete design system with AI for my product?

To create a design system with AI, provide your product context and research to generate aesthetics, typography, color, layout, spacing, and motion rules. The system outputs interactive proposals with safe and risk breakdowns for adjustments.

Can I generate UI/UX visual previews using my brand guidelines?

Yes, you can generate visual previews by integrating existing brand guidelines and design decisions. The system produces AI-rendered mockups and HTML preview pages applying your design system to realistic product screens.

Do I need gbrain configuration to generate a design system?

Yes, gbrain configuration is required to enable certain features of the design system generation process. You must configure gbrain alongside the design-system-generator dependency to unlock full interactive adjustment and risk exploration capabilities.

What's the best way to explore design risks when building a UI/UX design system?

The best way to explore design risks is using the interactive proposal feature, which presents a safe versus risks breakdown. This allows you to make interactive adjustments and explore potential design risks before finalizing your visual previews.

How does research integration work when generating typography and color systems?

Research integration works by utilizing your existing design decisions and brand guidelines as foundational input. The AI then processes this context to propose and implement comprehensive typography and color systems tailored to your product.