Skills
.Work. You
Rest

layout-inspecting

Official

Visualize webpage layouts with JSON, no screenshots needed.

Software Engineering#Playwright#UI inspection#DOM analysis#webpage layout#visual layout analysis
Authoremeraldwalk
Version1.0.0
Installs0

System Documentation

What problem does it solve?

This Skill provides a detailed visualization of webpage layouts through JSON, offering insight into UI structures and visual regions without requiring screenshots.

Core Features & Use Cases

  • Layout Inspection: Inspects and outputs a JSON tree representing the visual layout of a web page.
  • No Screenshots Required: Offers an alternative to visual analysis by providing a structured, programmatic view.
  • Use Case: When analyzing page design or verifying layout accuracy, this skill allows you to inspect page elements programmatically for a more in-depth understanding.

Quick Start

Run the layout-inspecting skill to get the layout JSON for the page at 'https://example.com'.

Dependency Matrix

Required Modules

playwright

Components

scriptsassets

💻 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: layout-inspecting
Download link: https://github.com/emeraldwalk/skills/archive/main.zip#layout-inspecting

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 620,000+ vetted skills library on demand.