design

Generate and maintain a design manifest from Tailwind config and CSS files.

820|78|Updated Mar 20, 2026

Search Tags:#typography #design #consistency #manifest #spacing #style-guide #visual-language

Ready to run

npx skills add https://github.com/SethGammon/Citadel --skill design-sethgammon

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: design
Source: https://github.com/SethGammon/Citadel/tree/main/skills/design
Command: npx skills add https://github.com/SethGammon/Citadel --skill design-sethgammon

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Documents and maintains a design manifest to enforce a consistent visual language across projects, reducing drift and rework by centralizing design decisions.

Core Features & Use Cases

Generate a starter manifest for new projects or when no manifest exists.
Read existing styles from sources such as Tailwind config and global CSS to extract patterns and document them.
Enforce consistency via a post-edit hook that flags deviations from the manifest.

Quick Start

Describe your project’s visual goals and preferences to generate a starter design manifest.

Frequently Asked Questions about design

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

FAQPage Schema

How do I maintain visual consistency across multiple projects?▼

To maintain visual consistency, generate a design manifest that documents colors, typography, and spacing. This centralized file enforces a unified visual language and reduces style drift across new or existing codebases.

Can I extract a style guide from an existing Tailwind config or CSS files?▼

Yes, you can extract a style guide from existing Tailwind config or global CSS files. The tool reads your current styles and user preferences to automatically document patterns into a structured design manifest.

What is a design manifest and how does it prevent visual drift?▼

A design manifest is a living document, specifically a .planning/design-manifest.md file, that records your project's visual language. It prevents visual drift by using an activation hook to flag deviations from established styles.

How do I generate a starter style guide for a new project?▼

Generate a starter style guide by describing your project's visual goals and preferences. The system uses this input to produce an initial design manifest with predefined sections for colors, typography, and spacing.

Does this work with existing codebases or only new projects?▼

This works with both existing codebases and new projects. For existing codebases, it reads current styles from sources like Tailwind config to extract patterns and document them, while also generating manifests for new setups.