design-direction-setter

Generate a design-brief.md with typography, color palette, and visual tone.

8|Updated Feb 18, 2026
One-click install
npx skills add https://github.com/gvkhosla/founder-skills --skill design-direction-setter
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: design-direction-setter
Source: https://github.com/gvkhosla/founder-skills/tree/main/skills/design/design-direction-setter
Command: npx skills add https://github.com/gvkhosla/founder-skills --skill design-direction-setter

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Establishes the visual tone, typography, color, and feel of your product before a line of UI is written. Use when you're about to build your UI and need a clear aesthetic direction, or when your product looks generic and you can't articulate why. Produces a design-brief.md with specific font, color, and visual direction choices your agent can implement immediately.

Core Features & Use Cases

  • Generates a design brief detailing typography, color palette, and visual tone for a UI.
  • Provides 3 visual references and 3 patterns to avoid to guide practical implementation.
  • Outlines a repeatable process to align design direction before development.

Quick Start

Answer 5 questions to generate a design brief that specifies typography, color palette, visual tone, and 3 reference products.

Frequently Asked Questions about design-direction-setter

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

FAQPage Schema
How do I establish a visual design direction before starting UI development?

To establish a visual design direction, you answer five structured questions to generate a design-brief.md detailing typography, color palette, visual tone, and three reference products.

What is the best way to create a design brief for a branding refresh?

Creating a design brief for a branding refresh involves outlining visual tone, typography, and color choices. This process outputs a markdown file providing three visual references and three patterns to avoid during practical implementation.

How do I define a cohesive color palette and typography for my product?

You define a cohesive color palette and typography by completing a five-question input process. This structured approach aligns your product team on specific font choices and color combinations before writing any UI code.

Can I use this design direction process for a UI design sprint?

Yes, you can use this design direction process during a UI design sprint. It is specifically applicable for sprint environments, producing a design-brief.md that your agent can implement immediately without further setup.

Why does my product UI look generic and how can I fix it?

Your product UI looks generic when it lacks an articulated visual tone and cohesive typography. You fix it by generating a structured design brief that specifies exact color choices, fonts, and visual references to guide development.