frontend-inspector

You can detect frontend visual bugs from a screenshot by applying vision-model analysis and automated checks to identify layout issues, alignment problems, and overflow. The Skill orchestrates these checks and emits a structured report with severity and recommendations.

Yes, you can use it for visual regression testing during UI review and design handoff. It validates UI implementations across breakpoints to ensure pixel-perfect alignment by detecting spacing inconsistencies and z-index conflicts.

Automated screenshot analysis identifies alignment problems, overflow, z-index conflicts, spacing inconsistencies, and color-contrast gaps. It applies vision-model prompts to orchestrate deterministic checks for these common visual defects.

Yes, you need python3 and bash installed to run these visual QA checks on frontend UIs. The deterministic analysis is implemented via scripts that require these dependencies to orchestrate the vision-model prompts.

The best way to check color contrast and typography in frontend screenshots is using automated vision-model analysis. The Skill applies automated checks for component consistency and generates a structured report of detected issues.

Frontend visual QA requires both because automated scripts orchestrate deterministic checks for precise layout bugs, while the vision-model identifies complex visual defects like spacing inconsistencies and color-contrast gaps that rule-based checks might miss.