Installs just this skill. Get the whole plugin for auto-invocation.
โก How it fires
How this skill gets triggered: by you, by Claude, or both.
Fires itselfClaude auto-loads it when your prompt matches the work.
You can call itInvoke it directly when you want it.
Slash command/skill-extract
๐๏ธ Context preview
The summary Claude sees to decide when to auto-load this skill.
Reverse-engineer design systems, tokens, and components from live products or screenshots
๐ Stats
Stars3,869
Forks362
LanguageShell
LicenseMIT
๐ฆ Ships with octo
</> SKILL.md
skill-extract.SKILL.md
---name: skill-extract
description: "Reverse-engineer design systems, tokens, and components from live products or screenshots"
---> **Host: Codex CLI** โ This skill was designed for Claude Code and adapted for Codex.
> Cross-reference commands use installed skill names in Codex rather than `/octo:*` slash commands.
> Use the active Codex shell and subagent tools. Do not claim a provider, model, or host subagent is available until the current session exposes it.
> For host tool equivalents, see `skills/blocks/codex-host-adapter.md`.
# Extract Skill - Implementation Guide
## Overview
The `extract` skill provides comprehensive reverse-engineering capabilities for design systems and product architectures. It transforms undocumented codebases into structured, implementation-ready documentation.
## Capabilities
### Design System Extraction
- **Token Extraction**: Colors, typography, spacing, shadows from code or CSS
- **Component Analysis**: Props, variants, usage patterns across React/Vue/Svelte
- **Pattern Detection**: Layout patterns, design rules, accessibility guidelines
- **Storybook Generation**: Auto-generated stories with variants and controls
### Product Architecture Extraction
- **Service Detection**: Microservice boundaries, modules, domain boundaries
- **API Mapping**: REST, GraphQL, tRPC, gRPC endpoint cataloging
- **Codex**: Code-level analysis, type extraction, architecture
- **Gemini**: Pattern recognition, alternative interpretations, UX insights
**Consensus Mechanism**:
- Threshold: extraction quality gates require the configured consensus threshold (default 67%); when no numeric vote data exists, the quorum resolver selects the strongest matching proposal from up to 3 provider perspectives and logs disagreements.
- Disagreements logged in `90_evidence/disagreements.md`
- Confidence scores attached to all outputs
## Output Structure
```
octopus-extract/
โโโ project-name/
โโโ timestamp/
โโโ README.md # Navigation and summary
โโโ metadata.json # Extraction parameters
โ
โโโ 00_intent/
โ โโโ answers.json # User intent responses