Skills
.Work. You
Rest

design-guide

Community

Automate modern UI design, effortlessly consistent.

Design & Creative#consistency#accessibility#frontend#minimalism#design system#Tailwind CSS#UI design
Authorjeremyspofford
Version1.0.0
Installs0

System Documentation

What problem does it solve?

This Skill eliminates inconsistent, cluttered, or outdated UI designs, and the manual effort required to maintain high design standards across your projects.

Core Features & Use Cases

  • Enforce Design Principles: Guides the creation of clean, minimal UIs with ample whitespace and focused content.
  • Consistent Standards: Ensures adherence to an 8px grid for spacing, a neutral color palette with one accent, and proper typography hierarchy.
  • Tailwind CSS Integration: Provides a starting point for Tailwind CSS configuration and component patterns (buttons, cards, forms) for rapid, compliant development.
  • Use Case: When building a new component, ask the AI to "apply the design guide to this button component" to get Tailwind CSS classes that ensure it's clean, accessible, and consistent with your brand.

Quick Start

Apply the design guide principles to this new user profile card component.

Dependency Matrix

Required Modules

None required

Components

Standard package

💻 Claude Code Installation

Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.

Please help me install this Skill:
Name: design-guide
Download link: https://github.com/jeremyspofford/dotfiles/archive/main.zip#design-guide

Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
View Source Repository

Agent Skills Search Helper

Install a tiny helper to your Agent, search and equip skill from 471,000+ vetted skills library on demand.