design-consultation

Generate a complete design system with DESIGN.md and preview pages.

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

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Plan and generate a complete design system for projects lacking one.

Core Features & Use Cases

It supports both new projects and existing sites, guiding brand guidelines, typography, color, layout, spacing, and motion, and can generate design-preview pages plus a DESIGN.md as the single source of truth. It also proactively suggests design decisions when starting from scratch.

Quick Start

Quick Start: Tell the AI to design a complete design system and generate a DESIGN.md 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 from scratch for a new project?

To create a design system from scratch, the tool proposes actionable decisions for brand guidelines, typography, color palettes, layout, spacing, and motion. It generates a DESIGN.md file to serve as the single source of truth for your project.

Can I generate design tokens and brand guidelines for an existing website?

Yes, you can generate design tokens and brand guidelines for an existing site. The tool analyzes your current project and produces a complete design specification, ensuring your established layout and color palette are documented.

What is a DESIGN.md file and how does it work as a single source of truth?

A DESIGN.md file is a comprehensive design specification document that centralizes all brand guidelines, typography, color, layout, spacing, and motion decisions. It acts as the single source of truth to keep your UI kit and design tokens consistent.

How do I generate a design-preview page to visualize my UI kit and color palette?

You can generate a design-preview page by instructing the tool to plan your complete design system. It outputs visual previews alongside your design tokens, allowing you to review your UI kit, typography, and color palette directly.

Does this tool work without existing brand guidelines or design tokens?

Yes, it works without existing brand guidelines or design tokens. The tool proactively suggests foundational design decisions from scratch, helping you establish typography, color, and layout before generating any code.

What's the best way to document typography and spacing rules for a design system?

The best way to document typography, layout, and spacing rules is by generating a consolidated DESIGN.md file. This document captures your complete design specification and design tokens, serving as the definitive reference for your project.