skills.rest
Santiagoisper
SantiagoisperCOMMUNITY
Explore all skills by this author →
GitHub

design-consultation

Propose a complete design system and generate preview pages with a DESIGN.md file.

Updated Mar 29, 2026
Search Tags:#design system#brand guidelines#UI design#preview generation#aesthetic design
One-click install
npx skills add https://github.com/Santiagoisper/BOPE_VERSION_DEFINITIVA --skill design-consultation-santiagoisper
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: design-consultation
Source: https://github.com/Santiagoisper/BOPE_VERSION_DEFINITIVA/tree/main/.agents/skills/gstack/design-consultation
Command: npx skills add https://github.com/Santiagoisper/BOPE_VERSION_DEFINITIVA --skill design-consultation-santiagoisper

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires Bash, Read, Write, Edit, Glob, Grep, AskUserQuestion, WebSearch, and includes scripts (resource) and references (resource) components.

What problem does it solve?

This Skill streamlines the design system creation process by offering a comprehensive approach to designing aesthetic, typography, color, layout, spacing, and motion, with automated generation of preview pages.

Core Features & Use Cases

  • Complete Design System: Proposes an entire design system with a focus on aesthetics, typography, color, layout, spacing, and motion.
  • Preview Generation: Generates font+color preview pages for immediate visual reference.
  • Documentation: Creates a DESIGN.md file as the project's design source of truth.
  • Use Case: When you need to design a new UI component and want to establish a cohesive design system quickly.

Quick Start

Start a new design consultation by running the /design-consultation command.

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 for UI components?▼

You can establish a complete design system by generating proposed aesthetics, typography, color, layout, spacing, and motion guidelines, finalized into a DESIGN.md file as your project's design source of truth.

How do I generate visual previews for typography and color guidelines?▼

Visual previews for typography and color guidelines are generated automatically as preview pages, providing immediate visual reference for your proposed design system.

What is the best way to document brand guidelines and UI design rules for a new project?▼

Documenting brand guidelines and UI design rules involves creating a DESIGN.md file that captures all proposed typography, color, layout, spacing, and motion decisions as a single source of truth.

Do I need specific tools to establish a design system with this approach?▼

Yes, establishing the design system requires Bash, Read, Write, Edit, Glob, Grep, AskUserQuestion, and WebSearch tools to propose guidelines, generate previews, and write the documentation.

Can I use this design consultation for an existing UI component library?▼

Yes, you can use this design consultation to propose a cohesive design system and generate a DESIGN.md file to align existing UI components with standardized typography, color, layout, spacing, and motion.

Related Skills

Explore More Design & Creative Skills→
sobhanashinesobhanashine
1

design-consultation

Create a design system from existing design documentation and landscape research.

Community
Advanced
luisgustavooliveiraluisgustavooliveira

design-consultation

Generate a comprehensive design system with preview pages and a DESIGN.md file.

Community
Advanced
AkbarDevopAkbarDevop

design-consultation

Propose a complete design system and generate a DESIGN.md document.

Community
Advanced
kk20300113-pngkk20300113-png

design-consultation

Generate a complete design system and DESIGN.md for new web and mobile applications.

Community
Advanced