New: 98,000+ skills indexed from GitHub repos with 100+ stars · every skill safety-checkedBrowse top skillsTop skills
Esc to closeBrowse all skills
Submit a skillBrowse skills
Submit a skillBrowse skills

Agent skill

Meticulous Iterative Dev

by FlintSH in FlintSH/Flare

Iterative frontend development loop using Meticulous for per-step visual validation.

MITAuto-check passedTesting & QA

Install Meticulous Iterative Dev

skills CLI
$ npx skills add FlintSH/Flare --skill meticulous-iterative-dev -a claude-code

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

GitHub CLI
$ gh skill install FlintSH/Flare meticulous-iterative-dev --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/FlintSH/Flare.git skills-src && mkdir -p .claude/skills && cp -r skills-src/.agents/skills/meticulous-iterative-dev .claude/skills/meticulous-iterative-dev && 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
meticulous-iterative-dev
GitHub stars
135
Token cost
~1.3k tokens
SKILL.md length
654 words
Files
1
Skills in repo
10
Repo updated
First seen
Licence
MIT

At a glance

Iterative frontend development loop using Meticulous for per-step visual validation.

  • Works in 4 steps: Implement the step's changes → Find relevant sessions → Simulate and analyse → …
  • Implementing a multi-step frontend change and want to catch visual regressions and unintended side effects at each step
  • SKILL.md covers Prerequisites, Per-step loop, After all steps — full cloud… and Final step — Report feedback…
  • Calls git, npm and pnpm; needs METICULOUS_API_TOKEN

What it does

Meticulous Iterative Dev is an agent skill from FlintSH/Flare. Iterative frontend development loop using Meticulous for per-step visual validation. Use when implementing a multi-step frontend change and want to catch visual regressions and unintended side effects at each step, before the final cloud test run.

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

It sits in Testing & QA, covering Frontend development and Visual regression testing. The repository describes itself as: A modern, lightning-fast file sharing platform built for self-hosting. Created with support for ShareX, KDE Spectacle, Flameshot, and easy to set up. The licence is MIT.

When your agent uses it

  • Implementing a multi-step frontend change and want to catch visual regressions and unintended side effects at each step
  • Before the final cloud test run

Example prompts

  • “/meticulous-iterative-dev”

Requirements

  • A credential in METICULOUS_API_TOKEN

Workflow steps

4 steps, taken from the step headings in SKILL.md.

  1. Implement the step's changes
  2. Find relevant sessions
  3. Simulate and analyse
  4. Commit

What it can do on your machine

Read from SKILL.md and the folder at commit c910523. 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

    Shell commands in SKILL.md call:

    • git
    • npm
    • pnpm

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

  • Network

    No URLs in SKILL.md. Its commands use git, npm and pnpm, which can reach the network depending on how they are called.

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

  • Credentials

    Names these keys or tokens, usually read from environment variables:

    • METICULOUS_API_TOKEN

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

Context cost

Meticulous Iterative Dev loads about 1.3k tokens when it runs. Until then it costs about 68 tokens; SKILL.md has 654 words of instructions outside code blocks.

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

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 FlintSH/Flare at commit c910523, republished under its MIT licence (© FlintSH). 654 words, ~1,338 tokens.

Download SKILL.mdSave it as .claude/skills/meticulous-iterative-dev/SKILL.md (or your agent's skills folder).
name
meticulous-iterative-dev
description
Iterative frontend development loop using Meticulous for per-step visual validation. Use when implementing a multi-step frontend change and want to catch visual regressions and unintended side effects at each step, before the final cloud test run.
user-invocable
true

Iterative Frontend Development with Meticulous

Use this skill when implementing a multi-step frontend change. After each step, run a quick local visual check using Meticulous to catch regressions and unintended side effects early. After all steps are complete, run a full cloud test run to validate across all recorded sessions.

Before starting, run the meticulous-cli-update skill to ensure the Meticulous CLI and skills are up to date — unless it has already run earlier in this conversation, in which case skip it.

Prerequisites

  • Local dev server running (e.g. npm run dev or pnpm dev), serving the app at a known URL such as http://localhost:3000
  • Authenticated with Meticulous: run meticulous auth whoami to log in via OAuth (an API token via METICULOUS_API_TOKEN or ~/.meticulous/config.json also works)
  • Meticulous CLI installed and on PATH (the meticulous-cli-update skill handles this)

Per-step loop

Repeat the following for each step of your change.

Step 1 — Implement the step's changes

Make your code changes for this step.

Step 2 — Find relevant sessions

Run:

bash
meticulous local relevant-sessions

If you have already committed previous steps and want to find sessions relevant only to this step's uncommitted changes, pass the SHA of the last commit:

bash
meticulous local relevant-sessions --startingPointSha=<sha-of-last-commit>

For full option reference see the meticulous-cli skill's local reference. The key fields to extract from each session in the output:

  • Session ID — pass as --sessionId when simulating
  • Base replay ID — the replay of this session on the base branch; pass as --baseReplayId to diff against. May be absent if the session has never been replayed on the base branch.
  • Relevance — IsRelevant / IsRelevantBeta means the session directly exercises changed code.

If no sessions are returned, the changed code is not covered by any recorded session. Proceed to Step 4 (commit) and rely on the final cloud run for coverage.

Step 3 — Simulate and analyse

Pick 1–2 of the most relevant sessions (prefer IsRelevant over IsRelevantBeta). For each, follow the meticulous-simulate-and-diff skill using:

  • --sessionId and --baseReplayId from step 2's output
  • --appUrl=http://localhost:<port> pointing at your local dev server
  • --headless (required — agents should not operate a visible browser)

If baseReplayId was absent from the output, omit it; use quick-check mode from that skill instead.

Also consider simulating a session for an unexpected flow surfaced by local relevant-sessions — one that covers code you didn't intend to change — to check for unintended side effects.

Once you have the analysis, classify each visual difference:

  • Expected — a direct, intended consequence of this step's changes. Proceed.
  • Unexpected — a visual change that was not a goal of this step (including side effects of your code, even if explainable). Investigate.
Show full SKILL.md (233 more words)Show less

If unexpected and the cause is clear: fix the code and re-simulate.

If the cause is unclear: create a self-contained AI-readable debug workspace using the replay IDs from the simulation output URL (see debug.md):

bash
meticulous debug replay <headReplayId> --baseReplayId=<baseReplayId>

Both IDs come from the simulation output URL: the head replay ID is the last path segment of the View simulation at: URL; the base replay ID is the --baseReplayId used in the simulate command. Open the workspace to diagnose, fix, and re-simulate.

Step 4 — Commit

Once the step's visual output is correct, commit your changes:

bash
git add -p
git commit -m "<concise description of this step>"

Committing after each step means the next iteration's --startingPointSha call computes the diff relative to this checkpoint, preventing prior steps' changes from inflating the set of relevant sessions.

Return to Step 1 for the next step.

After all steps — full cloud test run

Once all steps are complete and committed, run a full cloud test run to validate across all recorded sessions (not just the 1–2 you simulated locally):

Follow the meticulous-test skill.

The cloud run compares your branch against the base branch across the full golden set of sessions and reports any visual regressions.

Final step — Report feedback to Meticulous

After the cloud test run completes (the meticulous-test/meticulous-review skills end with their own feedback step covering the run itself), submit one brief feedback note about the iterative loop: did per-step simulation catch regressions early, and what would have made the workflow easier?

bash
# CLI
meticulous agent submit-feedback --message="<one or two sentences>" --outcome=<helped|neutral|hindered> --skill=meticulous-iterative-dev

# MCP
submit_feedback(message="<one or two sentences>", outcome="<helped|neutral|hindered>", skill="meticulous-iterative-dev")

© FlintSH, 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 .agents/skills/meticulous-iterative-dev of FlintSH/Flare.

Open the folder on GitHubat commit c910523

Compare with similar skills

Meticulous Iterative Dev 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.

Meticulous Iterative Dev compared with similar skills
SkillStarsUsed inTokensAuto-checkLicenceRepo updated
Meticulous Iterative Dev this skillFlintSH/Flare135—~1.3kAutomated safety check: PassMIT
UI Visual DebuggingNangoHQ/nango13k—~1.3kAutomated safety check: PassCustom licence
Common Web Visual TestingHoangNguyen0403/agent-skills-standard571—~760Automated safety check: PassMIT
UI CraftMemTensor/memmy-agent2.1k—~2.9kAutomated safety check: PassMIT
Visual Verdictvibeeval/vibecosystem531—~2.4kAutomated safety check: PassMIT
Omh Frontendrlaope/oh-my-hermes3.2k—~4kAutomated safety check: PassMIT

Similar skills

  • UI Visual Debugging

    NangoHQ/nango

    A skill your agent uses when modifying or visually debugging Nango frontend UI, including packages/webapp, packages/connect-ui, browser interactions, screenshots, and visual regressions.

    13k GitHub stars~1.3k tokensUpdated today
    Testing & QAAuto-check passed

  • Common Web Visual Testing

    HoangNguyen0403/agent-skills-standard

    Standardizes visual audits, responsive design, and behavioral testing for web apps.

    571 GitHub stars~760 tokensUpdated today
    Frontend & DesignAuto-check passed

  • UI Craft

    MemTensor/memmy-agent

    Design, build, redesign, or modify browser-visible web interfaces with product-quality composition, visual systems, interaction states, responsive behavior, accessibility, and browser visual QA.

    2.1k GitHub stars~2.9k tokensUpdated today
    Frontend & DesignAuto-check passed

  • Visual Verdict

    vibeeval/vibecosystem

    Screenshot comparison QA for frontend development. An agent skill from vibeeval/vibecosystem.

    531 GitHub stars~2.4k tokensUpdated 2 mo ago
    Frontend & DesignAuto-check passed

  • Omh Frontend

    rlaope/oh-my-hermes

    [omh] Building or polishing a web or terminal UI: prepare design-system-driven web and terminal (TUI) UI creation, redesign, polish, accessibility, performance, and visual QA handoffs.

    3.2k GitHub stars~4k tokensUpdated today
    Frontend & DesignAuto-check passed

  • Visual Ralph

    yangyuan-zhen/PolyWeather

    [OMX] Visual Ralph orchestration for frontend UI from generated references, static references, or live URL targets, using $ralph with built-in visual verdict and pixel-diff evidence until the…

    315 GitHub stars~2.3k tokensUpdated 17 days ago
    Frontend & DesignAuto-check passed

More from FlintSH/Flare

All 10 skills in this repo

  • Meticulous CLI

    FlintSH/Flare

    Overview of the Meticulous CLI tool and its global options. An agent skill from FlintSH/Flare.

    135 GitHub stars~1.4k tokensUpdated 2 days ago
    Auto-check passed

  • Meticulous Fix

    FlintSH/Flare

    Fix the visual diffs that have been reviewed and rejected on a Meticulous test run, following their review comments if given.

    135 GitHub stars~2.3k tokensUpdated 2 days ago
    Auto-check passed

  • Meticulous Increase Coverage

    FlintSH/Flare

    Increase coverage for a Meticulous project by tracing specific under-covered files back to a real UI action in the codebase, driving that action with a real recorded browser session, and validating…

    135 GitHub stars~7k tokensUpdated 2 days ago
    Auto-check passed

  • Meticulous Review

    FlintSH/Flare

    Analyze a completed Meticulous test run — compare the diffs against the PR description to see what's expected, then focus on finding and flagging potential regressions.

    135 GitHub stars~2.3k tokensUpdated 2 days ago
    Auto-check passed

  • Meticulous Simulate And Diff

    FlintSH/Flare

    Run a Meticulous session simulation against a live URL and analyze the visual output — either by inspecting screenshots directly (quick-check mode) or by comparing pixel and HTML diffs against a…

    135 GitHub stars~1.8k tokensUpdated 2 days ago
    Auto-check passed

  • Meticulous Test

    FlintSH/Flare

    Run a Meticulous test run after implementing a frontend change, then hand off to the meticulous-review skill to classify each visual change as intended or unintended.

    135 GitHub stars~1.2k tokensUpdated 2 days ago
    Auto-check passed

Categories

Questions about Meticulous Iterative Dev

What does Meticulous Iterative Dev do?

Iterative frontend development loop using Meticulous for per-step visual validation. Meticulous Iterative Dev is an agent skill from FlintSH/Flare. Iterative frontend development loop using Meticulous for per-step visual validation.

When should I use Meticulous Iterative Dev?

Meticulous Iterative Dev fits situations like: implementing a multi-step frontend change and want to catch visual regressions and unintended side effects at each step; before the final cloud test run.

How do I install Meticulous Iterative Dev in Claude Code?

Run `npx skills add FlintSH/Flare --skill meticulous-iterative-dev -a claude-code`. Or copy the skill folder (.agents/skills/meticulous-iterative-dev in FlintSH/Flare) into .claude/skills/meticulous-iterative-dev in your project. Claude Code loads it when a task matches its description.

How do I install Meticulous Iterative Dev in Codex?

Run `npx skills add FlintSH/Flare --skill meticulous-iterative-dev -a codex`. Or copy the skill folder (.agents/skills/meticulous-iterative-dev in FlintSH/Flare) into .agents/skills/meticulous-iterative-dev in your project. Codex loads it when a task matches its description.

Can I use Meticulous Iterative Dev 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 FlintSH/Flare --skill meticulous-iterative-dev -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/meticulous-iterative-dev, .gemini/skills/meticulous-iterative-dev, .github/skills/meticulous-iterative-dev and .opencode/skills/meticulous-iterative-dev in your project.

What does Meticulous Iterative Dev need to run?

Going by SKILL.md and its folder, Meticulous Iterative Dev needs the command-line tools its instructions call (git, npm and pnpm) and credentials named METICULOUS_API_TOKEN. Our summary lists: A credential in METICULOUS_API_TOKEN.

Does Meticulous Iterative Dev access the network?

SKILL.md contains no URLs. Its commands use git and npm, which can reach the network depending on how they are called. This is read from the text; nothing was executed.

Is Meticulous Iterative Dev 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 Meticulous Iterative Dev use?

Meticulous Iterative Dev 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 Meticulous Iterative Dev use?

About 1.3k tokens (SKILL.md is roughly 5.4k 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 Meticulous Iterative Dev?

Skills that share tags, products or a category with Meticulous Iterative Dev: UI Visual Debugging (NangoHQ/nango, 13k stars), Common Web Visual Testing (HoangNguyen0403/agent-skills-standard, 571 stars), UI Craft (MemTensor/memmy-agent, 2.1k stars) and Visual Verdict (vibeeval/vibecosystem, 531 stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.

Who maintains Meticulous Iterative Dev?

FlintSH (a GitHub user) maintains it in FlintSH/Flare, which has 135 GitHub stars. The repository holds 10 skills in this directory. The repository was last updated on October 6, 2026.

Source: FlintSH/Flare on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.