Getting it into your agent
One page per mod, every tool's command on it. A separate URL per tool would split the same page into five that compete with each other.
git clone --depth 1 https://github.com/trebormc/drupal-ai-agentsWrote this? Show the measurements
A badge with what this costs and how it scanned, read live from this page, so it follows the numbers instead of freezing them. Markdown for a README, HTML for a documentation site or a project page.
[](https://agentmods.dev/agents/trebormc/drupal-ai-agents/visual-analyzer)<a href="https://agentmods.dev/agents/trebormc/drupal-ai-agents/visual-analyzer"><img src="https://agentmods.dev/badge/agents/trebormc/drupal-ai-agents/visual-analyzer/github.svg" alt="Measured on agentmods" height="20"></a>Or the 80×15 button, for a site that already has a row of RSS and ATOM ones. Only the verdict fits; the numbers stay here.
<a href="https://agentmods.dev/agents/trebormc/drupal-ai-agents/visual-analyzer"><img src="https://agentmods.dev/badge/agents/trebormc/drupal-ai-agents/visual-analyzer.svg" alt="Reviewed on agentmods" width="80" height="20"></a>What it costs to keep this loaded
Counted locally with the o200k_base tokenizer, which is exact for GPT models; Claude uses its own tokenizer and its counts differ. Treat this as one consistent yardstick across the catalogue rather than a bill. Prices are per million input tokens.
| Model | Per session | Once invoked |
|---|---|---|
| Fable 5.1 | $0.00094 | $0.00881 |
| Opus 5.5 | $0.00038 | $0.00352 |
| Sonnet 5.5 | $0.00019 | $0.00176 |
| Haiku 4.5 | $0.00009 | $0.00088 |
Grade A, and why
visual-analyzer scanned grade A with 0 findings against 26 rules in 11 categories — prompt injection, anti-refusal, data exfiltration, privilege escalation, supply chain, agent snooping, system-prompt leakage, SSRF and excessive agency — measured 1mo ago.
A static scan of the body, not an audit. Every finding is printed with the line that produced it so you can judge whether it matters here. A mod is markdown that instructs an agent; that is exactly why what it instructs is worth reading.
Nothing flagged
None of the 26 patterns this scan looks for appear in this file: no shell pipes, no recursive deletes, no credential paths, no hidden text, no instruction-override or anti-refusal phrasing, no agent-config snooping. That is not a guarantee, it is the absence of the things that are checkable.
How it starts
The opening of the file, as written. The whole thing — 63 lines — stays where its author put it; the contents beside it link to each section on GitHub.
You are a Visual Analysis specialist. You run on a vision-capable model so you can SEE the content of images. Your job is to interpret screenshots and images: design quality, layout problems, accessibility, visual regressions, and information trapped inside images.
CRITICAL — vision honesty rule: Before analyzing, Read the image file and confirm you can actually perceive its content. If you cannot see the image (tool error, unsupported format, or you find yourself guessing), STOP and report exactly that — "I could not visually inspect this image" — and never fabricate a description. A made-up analysis is worse than no analysis.
Follow the screenshot-analysis skill for the full checklist, comparison workflow, and report format. It is your primary reference.
Workflow
- Get the image(s).
- If given a path:
Readthe file directly (screenshots live in/var/www/html/screenshots/). - If given a URL or page: capture it yourself —
browser_navigateto the HTTP URL ($DDEV_HTTP_URLbase), thenbrowser_take_screenshotwithfilename: "name.png"andfullPage: true. For admin pages authenticate first withssh web drush uli(convert the returned URL tohttp://).
- If given a path:
- Read each image with the Read tool — this is what puts the pixels in front of you.
- Analyze against the checklist in the screenshot-analysis skill (layout, spacing, typography, color/contrast, broken assets, error output, responsive artifacts).
- Report using the skill's report format: findings ordered by severity, each anchored to a specific region of the image ("header, right side", "second card in the grid").
What you are asked for, most commonly
| Request | What to do |
|---|---|
| "Review this design / screenshot" | Full checklist analysis, severity-ordered findings |
| "Compare before/after" | Read both images, list every visible difference, classify each as intended/regression/neutral |
| "What does this error screenshot say?" | Transcribe the exact text visible in the image |
| "Does this match the mockup?" | Read both, report deviations region by region |
| "Check responsive rendering" | browser_resize to 375/768/1440 widths, screenshot each, analyze each |
What this file has done since we first saw it
Hashed on every crawl. A supply-chain change to an agent config is a question of when, not whether, so the history is kept rather than the latest state alone.
- 1mo ago First seen · 63 lines · 94 tokens per session scan A 6d1e2720d4d7
visual-analyzer is an agent published in the GitHub repository trebormc/drupal-ai-agents (11 stars, last pushed 3mo ago), licensed Apache-2.0. It adds 94 tokens to every session and 881 once invoked, about $0.0004 per session on Opus 5.5. A static security scan graded it A with 0 findings. No closer match exists in the catalogue, so it is treated as the original; first seen 2026-08-31.
Other agents, from other repositories
ux-flow-auditor
Use this agent when the user mentions UX flow issues, dead-end views, dismiss traps, missing empty states, broken user journeys, or wants a UX audit of their iOS app.
canvas-create-screens
Groups approved functional intent into task-oriented screens, in-screen states and navigation without choosing Canvas controls.
design
Design system generator — maps product domain to style, palette, typography, anti-patterns. Creates .rune/design-system.md. Use BEFORE any frontend code generation.
mobile-ux-optimizer
Use this agent when you need to optimize UI/UX components or interfaces for mobile-first experiences, analyze existing design themes, or ensure mobile usability standards are met. Examples: Context: User has created a desktop-focused component and needs it optimized for mobile. user: 'I've built this navigation…
visual-reviewer
Visual regression reviewer that compares live web pages against Figma designs. Takes screenshots of both, runs pixel-level diff, and uses AI vision to evaluate whether differences are bugs or acceptable variations. Use before merge or deployment to catch visual regressions.
designer
Use for visual/UX design authoring — reference decomposition, design principles, divergent concept drafts, milestone screen prototypes, and DESIGN.md authoring support. Generation only; auditing stays with reviewer[design].