multimodal-looker

Name: multimodal-looker
Availability: InStock
Author: Postalocity

Analyze diagrams, screenshots, and UI mockups to extract components and design tokens.

1|Updated Mar 5, 2026

Search Tags:#accessibility #screenshots #multimodal #diagrams #design-tokens #visual-analysis #ui-mockups

Ready to run

npx skills add https://github.com/Postalocity/template-microsite --skill multimodal-looker-postalocity

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: multimodal-looker
Source: https://github.com/Postalocity/template-microsite/tree/main/.opencode/skills/multimodal-looker
Command: npx skills add https://github.com/Postalocity/template-microsite --skill multimodal-looker-postalocity

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Visual content analysis to understand diagrams, screenshots, and UI mockups, enabling automated extraction of structure, components, and design-related information.

Core Features & Use Cases

analyze_diagram: Analyze flowcharts, sequence diagrams, and architecture diagrams to extract relationships and structure.
analyze_screenshot: Identify UI components, layouts, and visual patterns from screenshots.
generate_ui_spec: Create UI specifications from mockups and visual assets.
extract_design_tokens: Extract colors, typography, spacing, and tokens from visuals.
accessibility_audit: Perform WCAG-based accessibility checks on visuals.
compare_visuals: Detect changes and regressions between visual assets to support visual QA.

Quick Start

Provide a diagram, screenshot, or UI mockup and ask multimodal-looker to analyze it and return diagrams, UI components, and design tokens.

Frequently Asked Questions about multimodal-looker

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

FAQPage Schema

How do I extract design tokens and UI components from a screenshot?▼

To extract design tokens and UI components from a screenshot, you need a multimodal visual analysis tool that identifies layouts, colors, typography, and spacing patterns directly from the image asset. This process automatically parses visual elements to generate structured UI specifications.

Can I perform an accessibility audit directly on UI mockups?▼

Yes, you can perform an accessibility audit on UI mockups by applying WCAG-based visual checks to the image. This analyzes color contrast, structural layout, and component visibility to identify potential accessibility issues before development begins.

What is the best way to detect visual regressions between UI screenshots?▼

The best way to detect visual regressions between UI screenshots is by using a compare_visuals function that analyzes changes between image assets. This supports visual QA by highlighting structural, layout, and color differences across product interfaces.

How do I analyze architecture diagrams to extract relationships and structure?▼

You can analyze architecture diagrams by applying a structured pipeline that identifies flowcharts, sequence relationships, and structural components within the visual content. This extracts the underlying connections and hierarchy directly from the diagram image.

Does multimodal visual analysis work without external dependencies?▼

Yes, multimodal visual analysis works without external dependencies, using an internal structured pipeline to process diagrams and UI mockups. It independently identifies components, design tokens, and accessibility issues from the provided visual assets.