Agent skill

Layout Reviewing

by pavel-molyanov in pavel-molyanov/molyanov-ai-dev

Reviews implemented web layouts for source fidelity, responsive behavior, evidence coverage, and project consistency.

MITAuto-check passed

Install Layout Reviewing

skills CLI
$ npx skills add pavel-molyanov/molyanov-ai-dev --skill layout-reviewing -a claude-code

Project install by default; add -g for ~/.claude/skills/.

GitHub CLI
$ gh skill install pavel-molyanov/molyanov-ai-dev layout-reviewing --agent claude-code

Project scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).

Manual copy
$ git clone --depth 1 https://github.com/pavel-molyanov/molyanov-ai-dev.git skills-src && mkdir -p .claude/skills && cp -r skills-src/skills/layout-reviewing .claude/skills/layout-reviewing && rm -rf skills-src

Use ~/.claude/skills/ instead of .claude/skills for a personal install. The folder must contain SKILL.md.

Claude Code skills documentation · loads skills from .claude/skills/

Facts

Skill name
layout-reviewing
GitHub stars
297
Token cost
~709 tokens
SKILL.md length
332 words
Files
1
Skills in repo
13
Repo updated
First seen
Licence
MIT

At a glance

Reviews implemented web layouts for source fidelity, responsive behavior, evidence coverage, and project consistency.

  • : проверь вёрстку
  • SKILL.md covers Review Basis, Evidence Coverage and Visual Criteria
  • Instructions only: no scripts, shell commands, URLs or credentials in SKILL.md
  • Проверь адаптив

What it does

Layout Reviewing is an agent skill from pavel-molyanov/molyanov-ai-dev. Reviews implemented web layouts for source fidelity, responsive behavior, evidence coverage, and project consistency. Use when: "проверь вёрстку", "ревью вёрстки", "проверь адаптив", "review layout", "check visual fidelity" Do NOT use for implementing or changing layouts — use layout-writing instead.

Its SKILL.md is about 710 tokens, which your agent loads only when the skill is triggered. It is a single SKILL.md file with no bundled scripts.

The repository describes itself as: Intent-driven AI-First development methodology for Claude Code and Codex — Project Knowledge, user-spec planning, focused execution, and evidence-gated reviews. The licence is MIT.

When your agent uses it

  • : проверь вёрстку
  • Проверь адаптив
  • Check visual fidelity Do NOT use for implementing
  • Changing layouts — use layout-writing instead

Example prompts

  • “review layout”
  • “check visual fidelity”
  • “Use the layout-reviewing skill to review implemented web layouts for source fidelity, responsive behavior, evidence coverage, and project consistency”
  • “/layout-reviewing”

What it can do on your machine

Read from SKILL.md and the folder at commit b5db526. It shows what the files ask for, not the result of running them.

  • Tool permissions

    Pre-approves nothing: there is no allowed-tools line, so your agent's usual permission prompts apply.

    From allowed-tools in the SKILL.md frontmatter.

  • Runs code

    No scripts in the folder and no shell commands in SKILL.md.

    From the folder's file list and the shell code blocks in SKILL.md.

  • Network

    No URLs in SKILL.md.

    From URLs in SKILL.md, links to its own repository left out.

  • Credentials

    Names no API keys, tokens, secrets or passwords.

    From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.

Context cost

Layout Reviewing loads about 709 tokens when it runs. Until then it costs about 80 tokens; SKILL.md has 332 words of instructions outside code blocks.

Always · name and description, kept in context so the agent knows when to use it
~80
When it runs · the whole SKILL.md, loaded when a task matches
~709

Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.

Safety

Auto-check passed

The automated check found no risky patterns in SKILL.md.

Automated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); files beside SKILL.md are not scanned.

SKILL.md

The full file from pavel-molyanov/molyanov-ai-dev at commit b5db526, republished under its MIT licence (© pavel-molyanov). 332 words, ~709 tokens.

Download SKILL.mdSave it as .claude/skills/layout-reviewing/SKILL.md (or your agent's skills folder).
name
layout-reviewing
description
Reviews implemented web layouts for source fidelity, responsive behavior, evidence coverage, and project consistency. Use when: "проверь вёрстку", "ревью вёрстки", "проверь адаптив", "review layout", "check visual fidelity" Do NOT use for implementing or changing layouts — use layout-writing instead.

Layout Reviewing

Judge the supplied implementation and prepared evidence. Do not redesign the interface or replace an intentional source value with personal taste.

Review Basis

  • Where an exact source exists, it controls defined geometry, spacing, color, typography, crop, effects, layering, content placement, and responsive states.
  • Where no source exists, use repository rules, the same component in other states, neighboring UI, tokens, and established components as the review standard.
  • For a partial source, keep these responsibilities separate. General design conventions do not override values the source defines intentionally.

Evidence Coverage

  • A selected-area review covers the changed block, its nearest positioning context, applicable states, and every required width.
  • A whole-page review requires an ordered source- or DOM-derived inventory and evidence for every listed block at every required width.
  • Required widths include baseline 360, 430, 768, and 1440 coverage, established source or user-screenshot viewports, and both sides of affected breakpoints.
  • Missing evidence is a defect only when the review contract requires it and its absence prevents a defined block, state, or width from being checked. Identify that missing coverage precisely.

Visual Criteria

Inspect each supplied width, block, and state for:

  • alignment, container bounds, spacing, density, sizing, and responsive reflow;
  • font family, weight, size, line height, wrapping, truncation, and text clipping;
  • colors, opacity, borders, radii, shadows, backgrounds, and layer order;
  • image or icon choice, aspect ratio, crop, position, and asset quality;
  • horizontal overflow, unusable compression, disappearing content, and broken interaction states;
  • consistency with project components and tokens where the source leaves a decision unspecified.

For exact-source comparisons, source and site blocks must have matching native dimensions. A diff image localizes pixel differences but does not prove a defect by itself. Attribute residual text differences to rasterization only after typography, wrapping, baselines, and bounds align.

Report only a concrete mismatch or coverage gap with a precise code or image-region location, observed evidence, violated source or project requirement, applicable width and state, and visible impact. Raster noise, taste, unsupported inference, and unrelated pre-existing layout issues are not findings.

© pavel-molyanov, MIT. Rendered from Markdown: HTML in the file is shown as text, images as links, and headings moved down two levels. Raw file

Files

Just SKILL.md in skills/layout-reviewing of pavel-molyanov/molyanov-ai-dev.

Open the folder on GitHubat commit b5db526

Compare with similar skills

Layout Reviewing next to the 5 skills that share the most tags, products or categories with it. Stars are the repository's; “used in” counts other GitHub owners with a copy.

Layout Reviewing compared with similar skills
SkillStarsUsed inTokensAuto-checkLicenceRepo updated
Layout Reviewing this skillpavel-molyanov/molyanov-ai-dev297—~709Automated safety check: PassMIT
Implementing Ot Incident Response Playbookmukul975/Anthropic-Cybersecurity-Skills34k—~4.2kAutomated safety check: PassApache-2.0
Responsive Unitsthedaviddias/Front-End-Checklist74k—~472Automated safety check: PassMIT
Responsive Designwshobson/agents40k2 repos~498Automated safety check: PassMIT
Implementsickn33/agentic-awesome-skills47k5 repos~306Automated safety check: PassMIT
Implementcodewhale-hq/Codewhale41k—~190Automated safety check: PassMIT

Similar skills

  • Implementing Ot Incident Response Playbook

    mukul975/Anthropic-Cybersecurity-Skills

    Develops OT-specific incident response playbooks using a SANS PICERL-based Python engine that classifies incident severity (safety, process, access, recon) and coordinates IT SOC, OT engineering…

    34k GitHub stars~4.2k tokensUpdated 1 mo ago
    DevOps & CloudAuto-check passed
  • Responsive Units

    thedaviddias/Front-End-Checklist

    A skill your agent uses when reviewing stylesheets, component styles, and responsive behavior related to Use relative units for responsive layouts.

    74k GitHub stars~472 tokensUpdated 4 days ago
    Frontend & DesignAuto-check passed
  • Responsive Design

    wshobson/agents

    Implement modern responsive layouts using container queries, fluid typography, CSS Grid, and mobile-first breakpoint strategies.

    40k GitHub starsUsed in 2 repos~498 tokens
    Frontend & DesignAuto-check passed
  • Implement

    sickn33/agentic-awesome-skills

    Implement a piece of work based on a PRD or set of issues. An agent skill from sickn33/agentic-awesome-skills.

    47k GitHub starsUsed in 5 repos~306 tokens
    Product & Project ManagementAuto-check passed
  • Implement

    codewhale-hq/Codewhale

    Carry an authorized, defined request or approved plan through scoped edits and proportionate verification.

    41k GitHub stars~190 tokensUpdated today
    Auto-check passed
  • Implementing Soar Automation With Phantom

    mukul975/Anthropic-Cybersecurity-Skills

    Implements Security Orchestration, Automation, and Response (SOAR) workflows using Splunk SOAR (formerly Phantom) to automate alert triage, IOC enrichment, containment actions, and incident response…

    34k GitHub stars~3.6k tokensUpdated 1 mo ago
    SecurityAuto-check passed

More from pavel-molyanov/molyanov-ai-dev

All 13 skills in this repo
  • Documentation Writing

    pavel-molyanov/molyanov-ai-dev

    Creates and maintains project documentation in .claude/skills/project-knowledge/: interview, initial Project Knowledge, audit, edit, consistency, and feature finalization.

    297 GitHub stars~2.7k tokensUpdated 1 mo ago
    Auto-check passed
  • User Spec Planning

    pavel-molyanov/molyanov-ai-dev

    Creates user-spec.md through adaptive interview, codebase research, and three-lane validation.

    297 GitHub stars~2.4k tokensUpdated 1 mo ago
    Auto-check passed
  • Infrastructure Setup

    pavel-molyanov/molyanov-ai-dev

    Provides project infrastructure conventions and review criteria for local setup, Docker, Git hooks, CI/CD, service delivery, release artifacts, monitoring, backups, and operations.

    297 GitHub stars~1.9k tokensUpdated 1 mo ago
    Auto-check: notes
  • Layout Writing

    pavel-molyanov/molyanov-ai-dev

    Reproduces and adjusts web layouts from Figma, Claude Design exports, screenshots, or an existing project style with high visual fidelity and proportional verification.

    297 GitHub stars~1.4k tokensUpdated 1 mo ago
    Auto-check passed
  • Skill Master

    pavel-molyanov/molyanov-ai-dev

    Guides skill creation and updates with specialized knowledge and workflows.

    297 GitHub stars~3.5k tokensUpdated 1 mo ago
    Auto-check passed
  • Project Initialization

    pavel-molyanov/molyanov-ai-dev

    Initializes a project from the standard dual-runtime template, preserves existing files, configures Git hooks, and creates or connects a private GitHub repository with main and dev branches.

    297 GitHub stars~1.1k tokensUpdated 1 mo ago
    Auto-check: notes

Questions about Layout Reviewing

What does Layout Reviewing do?

Reviews implemented web layouts for source fidelity, responsive behavior, evidence coverage, and project consistency. Layout Reviewing is an agent skill from pavel-molyanov/molyanov-ai-dev. Reviews implemented web layouts for source fidelity, responsive behavior, evidence coverage, and project consistency.

When should I use Layout Reviewing?

Layout Reviewing fits situations like: : проверь вёрстку; Проверь адаптив; check visual fidelity Do NOT use for implementing; changing layouts — use layout-writing instead.

How do I install Layout Reviewing in Claude Code?

Run `npx skills add pavel-molyanov/molyanov-ai-dev --skill layout-reviewing -a claude-code`. Or copy the skill folder (skills/layout-reviewing in pavel-molyanov/molyanov-ai-dev) into .claude/skills/layout-reviewing in your project. Claude Code loads it when a task matches its description.

How do I install Layout Reviewing in Codex?

Run `npx skills add pavel-molyanov/molyanov-ai-dev --skill layout-reviewing -a codex`. Or copy the skill folder (skills/layout-reviewing in pavel-molyanov/molyanov-ai-dev) into .agents/skills/layout-reviewing in your project. Codex loads it when a task matches its description.

Can I use Layout Reviewing in Cursor, Gemini CLI or GitHub Copilot?

Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add pavel-molyanov/molyanov-ai-dev --skill layout-reviewing -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/layout-reviewing, .gemini/skills/layout-reviewing, .github/skills/layout-reviewing and .opencode/skills/layout-reviewing in your project.

What does Layout Reviewing need to run?

SKILL.md names no scripts, command-line tools or credentials: Layout Reviewing is instructions for the agent only.

Does Layout Reviewing access the network?

SKILL.md contains no URLs. Any network use would come from the scripts or tools the agent runs. This is read from the text; nothing was executed.

Is Layout Reviewing safe to install?

Our automated static check of SKILL.md found no risky patterns, such as piping downloads into a shell, reading credential files or hidden Unicode. It is not a guarantee. Review the folder before installing.

What licence does Layout Reviewing use?

Layout Reviewing is published under the MIT licence (the repository's licence). It allows redistribution, so the full SKILL.md is shown on this page.

How many tokens does Layout Reviewing use?

About 709 tokens (SKILL.md is roughly 2.8k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full.

What are the alternatives to Layout Reviewing?

Skills that share tags, products or a category with Layout Reviewing: Implementing Ot Incident Response Playbook (mukul975/Anthropic-Cybersecurity-Skills, 34k stars), Responsive Units (thedaviddias/Front-End-Checklist, 74k stars), Responsive Design (wshobson/agents, 40k stars) and Implement (sickn33/agentic-awesome-skills, 47k stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.

Who maintains Layout Reviewing?

pavel-molyanov (a GitHub user) maintains it in pavel-molyanov/molyanov-ai-dev, which has 297 GitHub stars. The repository holds 13 skills in this directory. The repository was last updated on August 23, 2026.

Source: pavel-molyanov/molyanov-ai-dev on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.