skills.rest
nand1234
nand1234COMMUNITY
Explore all skills by this author →
GitHub

design-context

Load frontend design reviews from docs/design/$FEATURE.md before implementation.

Updated Mar 6, 2026
Search Tags:#design#frontend#questions#tokens#design-docs#design-review#implementation-guidance
One-click install
npx skills add https://github.com/nand1234/Agentic-workflow-builder --skill design-context-nand1234
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: design-context
Source: https://github.com/nand1234/Agentic-workflow-builder/tree/main/ai-dev-worflow/.claude/skills/design-context
Command: npx skills add https://github.com/nand1234/Agentic-workflow-builder --skill design-context-nand1234

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Loads design review output for a feature. Auto-load when implementing frontend tickets that have associated designs.

Core Features & Use Cases

  • Auto-loads an existing design review from docs/design/$FEATURE.md before frontend implementation.
  • Enforces following the design tokens and component inventory described in the design doc.
  • Flags and surfaces open design questions to avoid assumptions during implementation.

Quick Start

Check for an existing docs/design/$FEATURE.md design review and implement exactly as specified.

Frequently Asked Questions about design-context

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

FAQPage Schema
How do I load design context for frontend implementation?▼

Design context is loaded by reading docs/design/$FEATURE.md when present. This auto-loads existing design reviews to guide frontend work by enforcing component inventories, design tokens, and interaction flows before implementation begins.

How do I enforce design tokens and component inventories during frontend work?▼

Design tokens and component inventories are enforced by reading the associated design doc. The system auto-loads docs/design/$FEATURE.md and applies its specifications to ensure frontend implementation matches the reviewed design exactly.

What is the best way to surface design questions before implementing a frontend feature?▼

Surfacing design questions is done by auto-loading the design review from docs/design/$FEATURE.md. The system flags open questions and ambiguities found in the design doc, preventing assumptions during frontend implementation.

When do I need a design doc for frontend implementation?▼

A design doc is needed for frontend implementation when a ticket has an associated design. The system checks for docs/design/$FEATURE.md to auto-load design reviews, enforcing tokens and component inventories before coding starts.

Can I implement frontend features without a design review if the design doc is missing?▼

Without a design doc, design context cannot be loaded. The system requires docs/design/$FEATURE.md to be present to enforce component inventories, design tokens, and interaction flows, and to surface open design questions.

Related Skills

Explore More Design & Creative Skills→
jftecnologiajftecnologia

generate-ui-design

Generate UI/UX design specification documents from PRD requirements.

Official
Advanced
trusted-americantrusted-american

taia-design-system

Reference TAIA design system components, tokens, and usage patterns for Ember apps.

Official
Intermediate
darblexdarblex

ui-ux-pro-max

Generate design systems and frontend UI code for web frameworks.

Community
Advanced
jerome-benoitjerome-benoit
57

openspec-verify-change

Parse delta specs and generate a verification report with prioritized issues.

Community
Advanced