omd-component-harvest

Crawl public design systems to extract component patterns and tokens.

416|35|Updated Apr 13, 2026
One-click install
npx skills add https://github.com/kwakseongjae/oh-my-design --skill omd-component-harvest
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: omd-component-harvest
Source: https://github.com/kwakseongjae/oh-my-design/tree/main/.claude/skills/omd-component-harvest
Command: npx skills add https://github.com/kwakseongjae/oh-my-design --skill omd-component-harvest

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires playwright, python, and includes scripts (resource) and references (resource) components.

What problem does it solve?

This Skill automates the enhancement of component documentation by harvesting patterns and tokens from various design systems, providing comprehensive documentation for components.

Core Features & Use Cases

  • Component Documentation Harvesting: Extracts component patterns and tokens from existing design systems and references.
  • Pattern Expansion: Expands single landing snapshots to include multiple routes and interactions like modals, tabs, tables, etc.
  • Token Normalization: Ensures tokens are grounded in actual sources and follows best practices.
  • Use Case: For a company using a design system like Primer, this Skill can automatically enrich component documentation with patterns and tokens from the public design system.

Quick Start

Use the omd:component-harvest skill to enhance the documentation for the component found in 'references/<id>/DESIGN.md'.

Frequently Asked Questions about omd-component-harvest

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

FAQPage Schema
How do I automate extracting design system patterns and tokens for component documentation?

To automate design system pattern and token extraction for component documentation, you can use crawling tools to harvest public references and scripts to normalize the collected data directly into your local docs.

What is the best way to enrich component documentation with tokens from public design systems?

The best way to enrich component documentation with tokens is by crawling public design systems to harvest grounding tokens and applying normalization scripts to ensure they follow best practices.

Do I need Playwright to crawl design systems for component pattern harvesting?

Yes, you need Playwright to crawl public design systems for component pattern harvesting, as it enables the web scraping required to capture multiple routes and interactions like modals and tabs.

How does token normalization work when expanding component documentation?

Token normalization processes harvested design system data to ensure all tokens are grounded in actual sources and align with best practices before being integrated into local component documentation.

Can I expand a single landing snapshot to include modals, tabs, and tables for my design system?

Yes, you can expand a single landing snapshot by crawling public design system references to harvest interaction patterns, automatically enriching your documentation with modals, tabs, and tables.

What are the limitations of using Python scripts for design system component documentation?

Using Python scripts for component documentation requires processing harvested data from Playwright crawls, meaning limitations arise if public design systems block scraping or lack structured token references.