visual-analysis
Use when analyzing images, screenshots, UI mockups, or visual content for extracting information, comparing designs, or assessing visual properties like colors, typography, and layout
npx skills add majiayu000/claude-skill-registry --skill visual-analysis --agent claude-code
Same command for any agent — swap --agent for codex, cursor, copilot.
Weekly change comes from our own snapshots, not the repository page — it measures attention, not adoption.
# Visual Analysis Skill Analyze images, screenshots, and visual content. ## When to Use - Analyzing UI mockups or screenshots - Extracting information from images - Comparing visual designs - Quick visual assessments ## Quick Mode Fast, focused analysis for specific questions. **Prompt pattern:** ``` Analyze this image: [attach image] [specific question] ``` **Examples:** - "What text is visible in this UI?" - "List all colors used with their hex values" - "Identify all interactive elements" ## Deep Mode Comprehensive analysis with structured output. **Prompt pattern:** ``` Analyze this image comprehensively: 1. CONTENT INVENTORY - All UI elements present - Text content - Icons and imagery 2. VISUAL PROPERTIES - Color palette (hex values) - Typography (fonts, sizes, weights) - Spacing patterns - Layout structure 3. OBSERVATIONS - Design patterns used - Potential issues - Notable features Output as structured markdown. ``` ## Common Analysis Patterns ### UI Component Analysis ``` Analyze this UI component: 1. Component type and purpose 2. Visual states (hover, focus, disabled) 3. Accessibility considerations 4. Props/variants needed 5. Similar patterns in common UI libraries ``` ###
- When to Use
- Quick Mode
- Deep Mode
- Common Analysis Patterns
- UI Component Analysis
- Screenshot Comparison
- Color Extraction
- Layout Analysis
- Output Formats
- Storage
- Related Skills
What does the visual-analysis skill do?
Use when analyzing images, screenshots, UI mockups, or visual content for extracting information, comparing designs, or assessing visual properties like colors, typography, and layout
How do I install it?
Run `npx skills add majiayu000/claude-skill-registry --skill visual-analysis --agent claude-code` — it drops the skill into your project so the agent can pick it up. Swap the --agent value for codex, cursor or copilot if you use one of those.
Where does this skill come from?
From majiayu000/claude-skill-registry, a repository with 534 stars. We read it straight from the repository tree rather than a submitted listing, so what you see here is what is actually published.
Is a popular skill a good skill?
Not necessarily. Stars measure attention, not adoption — a repository can trend for a week and be abandoned. That is why we show the weekly change from our own snapshots next to the total, instead of a single flattering number.