Skills ai-visual-accuracy-check
📦

ai-visual-accuracy-check

Medium Risk 🌐 Network access📁 Filesystem access⚙️ External commands

Validate PDF-to-HTML Visual Accuracy

PDF-to-HTML conversions can look correct in markup while losing layout, hierarchy, or spacing. This skill guides Claude, Codex, or Claude Code through screenshot-based visual review with scored pass/fail output.

Supports: Claude Codex Code(CC)
⚠️ 50 Poor
1

Download the skill ZIP

2

Upload in Claude

Go to Settings → Capabilities → Skills → Upload skill

3

Toggle on and start using

Test it

Using "ai-visual-accuracy-check". Compare a rendered chapter page to its source PDF page image with the default threshold.

Expected outcome:

The page passes with a high visual similarity score. Layout and hierarchy match well, with only minor spacing differences.

Using "ai-visual-accuracy-check". Review a chapter after CSS changes caused layout shifts.

Expected outcome:

The page fails the threshold. The main issues are heading prominence, list indentation, and table alignment compared with the PDF.

Using "ai-visual-accuracy-check". Evaluate three representative pages from a multi-page chapter.

Expected outcome:

The average score is acceptable. The opening page is strongest, while the final page needs minor typography adjustments.

Security Audit

Medium Risk
v6 • 6/28/2026

The static analyzer's Ruby backtick, weak cryptography, and system reconnaissance findings are false positives caused by Markdown code fences, filenames, and ordinary prose. The skill still has medium operational risk because its intended workflow reads local HTML and image files, renders screenshots with a headless browser, and sends visual content to Claude for analysis.

1
Files scanned
385
Lines analyzed
8
findings
6
Total audits
Medium Risk Issues (2)
Third-Party AI Visual Analysis Sends Document Images
The workflow instructs the assistant to attach the original PDF PNG and rendered HTML screenshot to Claude for comparison. This is legitimate for the skill, but it may expose sensitive document pages to an external AI service if users provide confidential PDFs.
Local File Rendering and Report Output
The skill reads local HTML and PDF page image files, renders HTML through a headless browser, and saves a report under an output directory. This is expected behavior, but users should scope input and output paths to the project workspace.
Low Risk Issues (3)
Static Ruby Backtick Findings Are Markdown False Positives
The external command detections point to Markdown inline code, fenced code blocks, examples, diagrams, and file paths. I did not find Ruby code, shell backtick execution, or user-controlled command construction in the reviewed file.
Weak Cryptography Findings Are Textual False Positives
The weak cryptography detections correspond to the word AI and descriptive visual reasoning text, not cryptographic algorithms or hashing code. No evidence found of MD5, SHA-1, DES, or similar weak cryptographic usage.
System Reconnaissance Findings Are Documentation False Positives
The scanner flagged ordinary validation and comparison prose as reconnaissance. No evidence found of OS discovery, environment probing, host enumeration, or network scanning instructions.

Risk Factors

Detected Patterns

Headless Browser Automation
Audited by: codex View Audit History →

Quality Score

55
Architecture
100
Maintainability
87
Content
71
Community
49
Security
83
Spec Compliance

What You Can Build

Check converted textbook chapters

Compare generated chapter HTML against source PDF page images before release.

Gate document conversion pipelines

Add a score threshold that blocks deployment when visual fidelity falls below the expected level.

Review layout regressions

Use scored visual feedback to identify spacing, hierarchy, or positioning changes after CSS updates.

Try These Prompts

Run a single-page check
Use ai-visual-accuracy-check to compare chapter_02.html with 02_page_16.png. Use the default 85 threshold and summarize the pass or fail result.
Review a chapter sample
Use ai-visual-accuracy-check on the opening, middle, and final pages for chapter 4. Average the page scores and list the main visual differences.
Investigate a failed gate
Use ai-visual-accuracy-check to explain why the latest chapter failed the 85 visual threshold. Prioritize layout, hierarchy, positioning, and typography fixes.
Compare conversion variants
Use ai-visual-accuracy-check to compare two rendered HTML versions against the same PDF page. Recommend the version with stronger visual fidelity and explain the tradeoffs.

Best Practices

  • Use non-confidential samples unless your AI service policy allows document image sharing.
  • Keep the default 85 threshold until you have project-specific calibration data.
  • Store original PDF images and rendered screenshots with stable names for repeatable review.

Avoid

  • Do not treat the AI score as a replacement for accessibility or content correctness checks.
  • Do not lower the threshold to pass known layout defects without documenting the reason.
  • Do not render untrusted HTML outside a sandboxed browser environment.

Frequently Asked Questions

What does this skill compare?
It compares a rendered HTML screenshot with an original PDF page image.
Does it require Claude vision support?
Yes. The documented workflow expects a multimodal model that can inspect both images.
What score passes the gate?
The default pass threshold is 85 out of 100.
Can it handle multi-page chapters?
Yes. It recommends comparing key pages and averaging their scores.
Does it perform pixel-perfect comparison?
No. It uses contextual visual judgment rather than strict pixel differences.
What data should users protect?
Users should protect confidential PDF pages, rendered screenshots, and generated reports.

Developer Details

File structure

📄 SKILL.md