web-design-reviewer

Inspect website code for layout, typography, accessibility, and responsiveness issues.

1|1|Updated Feb 2, 2026
One-click install
npx skills add https://github.com/navikt/watson-sak-frontend --skill web-design-reviewer-navikt
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: web-design-reviewer
Source: https://github.com/navikt/watson-sak-frontend/tree/main/.opencode/skills/web-design-reviewer
Command: npx skills add https://github.com/navikt/watson-sak-frontend --skill web-design-reviewer-navikt

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

Visuell inspeksjon og validering av designkvalitet på nettsider. Identifiserer og fikser problemer med responsivt design, tilgjengelighet, visuell konsistens og layout i kildekoden.

Core Features & Use Cases

Visuell inspeksjon og validering av designkvalitet på nettsider, identifiserer og fikser problemer på kildekodenivå. Anvendelse inkluderer statiske nettsider, SPA-rammeverk som React / Vue / Angular / Svelte, Next.js / Nuxt / SvelteKit, og andre webapplikasjoner. Use cases: Validates layouts and typography across pages, ensures accessibility, and verifies responsive behavior during development and QA.

Quick Start

Run a design review on your project to identify responsive, accessibility, and visual-consistency issues and apply fixes in the source code.

Frequently Asked Questions about web-design-reviewer

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

FAQPage Schema
How do I run a visual design review on my web application source code?

To run a visual design review, apply this skill to your project source code to identify responsive, accessibility, and layout issues, then apply fixes directly in the CSS and JS files.

Can I validate responsive design and accessibility in a React SPA?

Yes, you can validate responsive design and accessibility in a React SPA. The skill visually inspects single-page applications to ensure visual consistency and fix layout problems in the source.

Does web design inspection work with Next.js and SvelteKit frameworks?

Web design inspection works with Next.js and SvelteKit frameworks. The skill performs visual validation across pages to verify typography, layout, and responsive behavior during development.

What do I need to fix visual consistency issues in my web project?

You need browser automation for visual inspection and access to the project source code. The skill uses these to identify visual consistency issues and apply code-level fixes to your web application.

Why does my web layout break across different pages during QA?

Your web layout may break due to visual consistency issues in the source code. A visual design review identifies these layout problems, validates typography, and applies necessary CSS fixes across pages.

Is browser automation required to inspect website design quality?

Yes, browser automation is required to inspect website design quality. The skill relies on browser automation to perform visual inspection and validate layout and responsive behavior across web pages.