skills.rest
JansenAnalytics
JansenAnalyticsCOMMUNITY
Explore all skills by this author →
GitHub

responsive-checker

Test responsive design across mobile, tablet, and desktop viewports using Chromium scripts.

5|Updated Apr 8, 2026
Search Tags:#automation#testing#screenshots#responsive#breakpoints#overflow#css-analysis
One-click install
npx skills add https://github.com/JansenAnalytics/claudex --skill responsive-checker-jansenanalytics
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: responsive-checker
Source: https://github.com/JansenAnalytics/claudex/tree/main/skills/responsive-checker
Command: npx skills add https://github.com/JansenAnalytics/claudex --skill responsive-checker-jansenanalytics

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) and references (resource) components.

What problem does it solve?

Tests and validates responsive design across multiple viewport sizes.

Core Features & Use Cases

  • Capture visual references at mobile, tablet, and desktop breakpoints using automated scripts.
  • Detect layout overflow, non-responsive elements, and breakpoint coverage gaps.
  • Provide QA-ready insights to verify CSS and media queries across breakpoints.

Quick Start

Run responsive-capture.py on your target URL to generate screenshots at mobile, tablet, and desktop breakpoints.

Frequently Asked Questions about responsive-checker

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

FAQPage Schema
How do I test responsive design across multiple viewport sizes?▼

You can verify responsive design by running automated Python scripts that use Chromium to capture and analyze screenshots across mobile, tablet, and desktop viewport breakpoints.

What is the best way to detect CSS overflow issues at different breakpoints?▼

To detect CSS overflow issues, the overflow-detector script analyzes captured viewport screenshots to flag layout overflow and non-responsive elements across defined breakpoints.

Can I use automated scripts to capture screenshots for mobile, tablet, and desktop breakpoints?▼

Yes, the responsive-capture.py script automates capturing screenshots at mobile, tablet, and desktop breakpoints by running Chromium against your target URL.

Does responsive layout testing work without external dependencies?▼

Responsive layout testing works without external dependencies, relying on internal Python and shell scripts that leverage a local Chromium browser to analyze CSS.

Why does my layout break when verifying media queries across breakpoints?▼

Layout breaks during media query verification often stem from breakpoint coverage gaps or non-responsive elements, which the breakpoint-analyzer.sh script identifies.

When do I need to analyze CSS for breakpoint coverage gaps?▼

You need to analyze CSS for breakpoint coverage gaps when visual references indicate layout overflow, requiring breakpoint-analyzer.sh to flag missing media queries.

Related Skills

Explore More Software Engineering Skills→
onbluerosesonblueroses
3

mobile-preview

Capture mobile viewport screenshots of web pages to test responsiveness.

Community
Basic
Luqman-Ud-DinLuqman-Ud-Din

qa-detect-breakpoint-boundary

Detect CSS breakpoint overflow and edge-cutoff defects at exact viewport widths.

Community
Intermediate
probationer070probationer070

browse

Automate web application testing with Playwright headless browser interactions.

Community
Advanced
sidjamylsidjamyl

responsive-design

Implement responsive layouts with container queries, fluid typography, and CSS Grid.

Community
Intermediate