responsive-design-tester

Community

Audit responsive design across devices.

Authoranouar1991
Version1.0.0
Installs0

System Documentation

What problem does it solve?

This Skill automates a full responsive design audit across six viewports to surface layout issues, overflow, touch target compliance, and image responsiveness, then compiles per-viewport diagnostics and a visual record.

Core Features & Use Cases

  • Viewport coverage: tests mobile S/M/L, tablet, desktop, and ultrawide sizes to reveal cross-device rendering gaps.
  • Quality checks: validates viewport meta, detects horizontal overflow, checks touch targets, font readability, image srcset usage, and responsive image markup.
  • Use Case: before shipping a new page, run this skill to generate a side-by-side viewport issue report and screenshots for design QA and developer handoff.

Quick Start

Run the responsive-design-tester against a target page to generate a multi-viewport audit with screenshots and a consolidated report.

Dependency Matrix

Required Modules

None required

Components

references

💻 Claude Code Installation

Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.

Please help me install this Skill:
Name: responsive-design-tester
Download link: https://github.com/anouar1991/binaryPetsClaude/archive/main.zip#responsive-design-tester

Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
View Source Repository

Agent Skills Search Helper

Install a tiny helper to your Agent, search and equip skill from 223,000+ vetted skills library on demand.