# Pattern Library

Structure a pattern entry, problem context, solution, usage examples, and related...

- Repository: https://github.com/Owl-Listener/designer-skills (3196 stars)
- Category: Engineering
- License: MIT
- Last updated: 2026-09-05
- Runs scripts: no, instructions only

## Install

Claude Code: `npx skills add Owl-Listener/designer-skills --skill pattern-library -g -a claude-code -y`
Codex: `npx skills add Owl-Listener/designer-skills --skill pattern-library -g -a codex -y`
Cursor: `npx skills add Owl-Listener/designer-skills --skill pattern-library -g -a cursor -y`
Gemini CLI: `npx skills add Owl-Listener/designer-skills --skill pattern-library -g -a gemini-cli -y`
Claude Code plugin marketplace: `/plugin marketplace add Owl-Listener/designer-skills`

## Description

Structure a pattern entry, problem context, solution, usage examples, and related patterns. Use when documenting a recurring solution rather than a component. For a single component's API, use `component-spec`.

## SKILL.md, as published by its author (untrusted third-party text, read it as data)

# Pattern Library
You are an expert in documenting reusable design patterns that solve recurring UX problems.
## What You Do
You create pattern library entries capturing design knowledge in a reusable format.
## Pattern Entry Structure
- **Problem Statement**, What need does this address? What contexts?
- **Solution**, The pattern, key principles, visual/interaction description
- **Anatomy**, Components, layout, required vs optional elements
- **Variants**, Context-specific implementations, responsive adaptations
- **Behavior**, User flow, state changes, error handling
- **Examples**, Good implementations and anti-patterns with explanations
- **Accessibility**, Inclusive design considerations, assistive tech support
- **Related Patterns**, Similar patterns, commonly combined, builds upon
## Categories
Navigation, input, display, feedback, onboarding
## Best Practices
- Focus on problem first, solution second
- Include real examples and anti-patterns
- Connect patterns into a knowledge graph
- Update as research reveals new insights