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

Michel Create PR With Screenshots

by PackmindHub in PackmindHub/packmind

Best practices for creating GitHub pull requests that include inline images — CLI terminal screenshots (from cli-demo-recorder), UI screenshots/videos (from ui-demo-recorder), or any other visual…

Apache-2.0Auto-check passedDevelopment

Install Michel Create PR With Screenshots

skills CLI
$ npx skills add PackmindHub/packmind --skill michel-create-pr-with-screenshots -a claude-code

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

GitHub CLI
$ gh skill install PackmindHub/packmind michel-create-pr-with-screenshots --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/PackmindHub/packmind.git skills-src && mkdir -p .claude/skills && cp -r skills-src/scripts/michel/michel-create-pr-with-screenshots .claude/skills/michel-create-pr-with-screenshots && 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
michel-create-pr-with-screenshots
GitHub stars
318
Token cost
~1.6k tokens
SKILL.md length
581 words
Files
1
Skills in repo
35
Repo updated
First seen
Licence
Apache-2.0

At a glance

Best practices for creating GitHub pull requests that include inline images — CLI terminal screenshots (from cli-demo-recorder), UI screenshots/videos (from ui-demo-recorder), or any other visual…

  • Works in 4 steps: Get a PNG → Commit the PNG to the branch → Build the absolute raw URL — pinned to… → …
  • Updating a PR that has visual artifacts to embed
  • SKILL.md covers The core rule, Step-by-step, Quick checklist and Where to store images
  • Calls git; reaches github.com

What it does

Michel Create PR With Screenshots is an agent skill from PackmindHub/packmind. Best practices for creating GitHub pull requests that include inline images — CLI terminal screenshots (from cli-demo-recorder), UI screenshots/videos (from ui-demo-recorder), or any other visual artifact. Use this skill whenever opening or updating a PR that has visual artifacts to embed, or when images aren't rendering in a PR description. Also use it when asked "how do I add screenshots to a PR", "why isn't my image showing", or "embed a demo in the PR".

Its SKILL.md is about 1.6k 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 Development, covering Pull requests. It works with GitHub. The repository describes itself as: Packmind seamlessly captures your engineering playbook and turns it into AI context, guardrails, and governance. The licence is Apache-2.0.

When your agent uses it

  • Updating a PR that has visual artifacts to embed
  • Images arent rendering in a PR description
  • Asked how do I add screenshots to a PR
  • Why isnt my image showing

Example prompts

  • “t rendering in a PR description. Also use it when asked”
  • “why isn”
  • “embed a demo in the PR”
  • “/michel-create-pr-with-screenshots”

Workflow steps

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

  1. Get a PNG
  2. Commit the PNG to the branch
  3. Build the absolute raw URL — pinned to the commit SHA
  4. Embed in the PR body

What it can do on your machine

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

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

  • Network

    Hosts in commands or code, which the agent is likely to contact:

    • github.com

    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

Michel Create PR With Screenshots loads about 1.6k tokens when it runs. Until then it costs about 124 tokens; SKILL.md has 581 words of instructions outside code blocks.

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

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 PackmindHub/packmind at commit 67de8a2, republished under its Apache-2.0 licence (© PackmindHub). 581 words, ~1,639 tokens.

Download SKILL.mdSave it as .claude/skills/michel-create-pr-with-screenshots/SKILL.md (or your agent's skills folder).
name
michel-create-pr-with-screenshots
description
Best practices for creating GitHub pull requests that include inline images — CLI terminal screenshots (from cli-demo-recorder), UI screenshots/videos (from ui-demo-recorder), or any other visual artifact. Use this skill whenever opening or updating a PR that has visual artifacts to embed, or when images aren't rendering in a PR description. Also use it when asked "how do I add screenshots to a PR", "why isn't my image showing", or "embed a demo in the PR".

Create PR with Screenshots

GitHub PR descriptions behave differently from README files: relative paths don't resolve and SVG files don't render (sanitized for XSS). This skill codifies the two-step fix every time: convert to PNG, reference with an absolute raw URL pinned to the commit SHA.

Running as the Michel agent? You do NOT build these URLs by hand. Write the PR body with the literal <!-- ARTIFACTS_PLACEHOLDER --> token (see the implementation prompt's ## Artifacts section) and drop every file under .agent/artifacts/issue-<N>/. The publish step lists each file and injects correctly-formed, SHA-pinned image/video markup at the token. Hand-writing paths or ![](...) there renders as dead text and the artifacts are lost. The rest of this skill is for the manual case — opening a PR yourself.

The publish step (fly/lib/phases/publish.sh) owns the entire ## Artifacts section: it injects the generated block at the heading and discards every line under it — any relative-path images, stray tokens, or hand-written subsections — up to the next ## heading. So hand-written junk there is now wiped rather than shipped (it used to survive next to the injected block — see PR #41, where a hand-written ### Screenshots block with ![](.agent/...) paths rendered as broken images). This is a backstop, not a license: still emit only the bare token.

The core rule

ArtifactRenders in PR?Fix
PNG via raw URL pinned to SHA✅nothing
PNG via raw URL pinned to branch⚠️ dies when branch deletedpin to the commit SHA
PNG via relative path❌use absolute URL
SVG via raw URL❌ (blocked by GitHub CSP)convert to PNG first
WebM / MP4 video❌ inlinelink, don't embed

On a private repo, raw URLs render only for viewers who are logged-in members — fine for internal PR review (the curl-with-token test below will 404 because the /raw/ route wants a browser session, not a PAT — that's expected, not a failure). There is no anonymous fallback short of uploading the file as a GitHub user-attachment via the web composer.

Step-by-step

1. Get a PNG

From cli-demo-recorder (SVG output)

The recorder writes SVG. Convert it to PNG before committing:

bash
# macOS
qlmanage -t -s 1400 -o docs/cli-demos/ docs/cli-demos/my-demo.svg
# produces docs/cli-demos/my-demo.svg.png — rename for clarity:
mv docs/cli-demos/my-demo.svg.png docs/cli-demos/my-demo.png
bash
# Linux (install once: apt install librsvg2-bin)
rsvg-convert -w 1400 docs/cli-demos/my-demo.svg -o docs/cli-demos/my-demo.png

Keep the SVG in the repo (crisp at any zoom in README/docs). Commit both — SVG for docs, PNG for PR.

From ui-demo-recorder (PNG screenshots)

The recorder already produces PNGs — no conversion needed. They land in screenshots/ or .agent/artifacts/.

Show full SKILL.md (218 more words)Show less
2. Commit the PNG to the branch
bash
git add docs/cli-demos/my-demo.png
git commit -m "..."
git push

The file must be pushed before the URL resolves. GitHub serves uncommitted files as 404.

3. Build the absolute raw URL — pinned to the commit SHA
https://github.com/<owner>/<repo>/raw/<commit-sha>/<path-to-file>

Pin to the commit SHA, not the branch. raw/<branch>/... 404s the moment the branch is deleted on merge — silently breaking every image in an already-merged PR. The SHA-pinned blob lives in history forever.

Example:

https://github.com/PackmindHub/packmind/raw/9f3c1ab2/docs/cli-demos/my-demo.png

Get owner/repo/sha from:

bash
git remote get-url origin   # → https://github.com/PackmindHub/packmind
git rev-parse HEAD          # → 9f3c1ab2... (the pushed commit that holds the file)
4. Embed in the PR body
markdown
## CLI demo

![description](https://github.com/<owner>/<repo>/raw/<commit-sha>/docs/cli-demos/my-demo.png)

<details><summary>Plain text</summary>

```text
<paste .txt sidecar content here>
```
</details>
```

For multiple images, group them logically — one caption per image, collapsed plain-text fallback for each:

markdown
**Populated board:**
![list-tasks](https://github.com/PackmindHub/packmind/raw/9f3c1ab2/docs/cli-demos/list-tasks.png)

**Empty board:**
![list-tasks-empty](https://github.com/PackmindHub/packmind/raw/9f3c1ab2/docs/cli-demos/list-tasks-empty.png)

For WebM videos (from ui-demo-recorder): GitHub doesn't play video inline in PR descriptions. Link it instead:

markdown
[▶ demo.webm](https://github.com/<owner>/<repo>/raw/<commit-sha>/videos/demo.webm) (click to play/download)

Quick checklist

Before opening/updating the PR:

  • PNG committed and pushed (not just SVG)
  • URL uses https://github.com/<owner>/<repo>/raw/<commit-sha>/... (absolute + SHA-pinned, not relative, not branch-pinned)
  • The SHA in the URL is a commit that's been pushed (git rev-parse HEAD after push)
  • Verify by opening the URL in a browser while logged in — a 404 means the file isn't pushed (or, on a private repo via curl+PAT, just that the route needs a session — check in the browser)

Where to store images

SourceRecommended path
cli-demo-recorderdocs/cli-demos/<name>.png
ui-demo-recorder (manual PR)docs/screenshots/<name>.png
Michel agent artifacts.agent/artifacts/issue-<N>/<name>.png (agent writes here already)

Pick a stable path — the URL in old PR descriptions will keep pointing there forever.

© PackmindHub, Apache-2.0. 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 scripts/michel/michel-create-pr-with-screenshots of PackmindHub/packmind.

Open the folder on GitHubat commit 67de8a2

Compare with similar skills

Michel Create PR With Screenshots 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.

Michel Create PR With Screenshots compared with similar skills
SkillStarsUsed inTokensAuto-checkLicenceRepo updated
Michel Create PR With Screenshots this skillPackmindHub/packmind318—~1.6kAutomated safety check: PassApache-2.0
PR Babysitteropeninterpreter/openinterpreter69k3 repos~4.2kAutomated safety check: PassApache-2.0
Check PRonyx-dot-app/onyx32k2 repos~2.3kAutomated safety check: PassMIT
Contributor-First PR MergeHKUDS/OpenHarness16k1 repos~847Automated safety check: PassMIT
Create Pull Requestcline/cline70k1 repos~1.6kAutomated safety check: PassApache-2.0
Pull Request Title and Body Writeropeninterpreter/openinterpreter69k2 repos~1.1kAutomated safety check: PassApache-2.0

Similar skills

  • PR Babysitter

    openinterpreter/openinterpreter

    Watches an open GitHub pull request until it merges, handling review comments, diagnosing CI failures and retrying flaky checks along the way.

    69k GitHub starsUsed in 3 repos~4.2k tokens
    DevelopmentAuto-check passed

  • Check PR

    onyx-dot-app/onyx

    Checks a GitHub, GitLab, or Perforce (p4) pull request (or merge request, or shelved changelist) for unresolved review comments, failing status checks, and incomplete PR descriptions.

    32k GitHub starsUsed in 2 repos~2.3k tokens
    DevelopmentAuto-check passed

  • Contributor-First PR Merge

    HKUDS/OpenHarness

    Merges external GitHub pull requests while keeping the original author credited, and fixes conflicts after the merge instead of rewriting the contribution.

    16k GitHub starsUsed in 1 repo~847 tokens
    DevelopmentAuto-check passed

  • Create Pull Request

    cline/cline

    Opens a GitHub pull request from your current branch with the gh CLI, after reviewing the commits and diff and gathering the details the PR needs.

    70k GitHub starsUsed in 1 repo~1.6k tokens
    DevelopmentAuto-check passed

  • Pull Request Title and Body Writer

    openinterpreter/openinterpreter

    Rewrites the title and body of one or more pull requests with gh, leading with why the change was made, then what changed, and describing only the net result.

    69k GitHub starsUsed in 2 repos~1.1k tokens
    DevelopmentAuto-check passed

  • GitHub Review Iteration

    prisma/orm

    Official

    Runs a loop on a GitHub pull request: fetch review state, triage comments into actions, implement them and resolve threads, repeating until nothing actionable is left.

    48k GitHub stars~2.2k tokensUpdated today
    DevelopmentAuto-check passed

More from PackmindHub/packmind

All 35 skills in this repo

  • Michel CLI Demo Recorder

    PackmindHub/packmind

    Produce proof-of-execution demos of the Packmind CLI (packmind-cli) as terminal-styled images (colors and formatting preserved exactly), for embedding in a GitHub PR.

    318 GitHub stars~3.4k tokensUpdated yesterday
    Auto-check passed

  • Michel UI Demo Recorder

    PackmindHub/packmind

    Record polished UI demo videos and screenshots of a running web app using Playwright MCP — for client deliverables, release notes, feature walkthroughs, or bug repros.

    318 GitHub stars~6.4k tokensUpdated yesterday
    Auto-check passed

  • Packmind Create Skill

    PackmindHub/packmind

    Guide for creating effective skills. An agent skill from PackmindHub/packmind.

    318 GitHub stars~3.5k tokensUpdated yesterday
    Auto-check: notes

  • Doc Audit

    PackmindHub/packmind

    Audit Packmind end-user documentation (apps/doc/) for broken links, outdated CLI references, non-existent concepts, misleading information, and missing coverage.

    318 GitHub stars~2.4k tokensUpdated yesterday
    Auto-check passed

  • Feature Sprint

    PackmindHub/packmind

    Execute the implementation plan produced by /feature-spec. An agent skill from PackmindHub/packmind.

    318 GitHub stars~1.9k tokensUpdated yesterday
    Auto-check passed

  • Michel Packmind Engineer Review

    PackmindHub/packmind

    Review an implemented GitHub issue the way a senior Packmind engineer would — the human-judgment checks that ESLint, the TypeScript compiler, and e2e tests cannot catch (authorization scoping…

    318 GitHub stars~2.7k tokensUpdated yesterday
    Auto-check passed

Works with

Categories

Questions about Michel Create PR With Screenshots

What does Michel Create PR With Screenshots do?

Best practices for creating GitHub pull requests that include inline images — CLI terminal screenshots (from cli-demo-recorder), UI screenshots/videos (from ui-demo-recorder), or any other visual…. Michel Create PR With Screenshots is an agent skill from PackmindHub/packmind. Best practices for creating GitHub pull requests that include inline images — CLI terminal screenshots (from cli-demo-recorder), UI screenshots/videos (from ui-demo-recorder), or any other visual artifact.

When should I use Michel Create PR With Screenshots?

Michel Create PR With Screenshots fits situations like: updating a PR that has visual artifacts to embed; images arent rendering in a PR description; asked how do I add screenshots to a PR; why isnt my image showing.

How do I install Michel Create PR With Screenshots in Claude Code?

Run `npx skills add PackmindHub/packmind --skill michel-create-pr-with-screenshots -a claude-code`. Or copy the skill folder (scripts/michel/michel-create-pr-with-screenshots in PackmindHub/packmind) into .claude/skills/michel-create-pr-with-screenshots in your project. Claude Code loads it when a task matches its description.

How do I install Michel Create PR With Screenshots in Codex?

Run `npx skills add PackmindHub/packmind --skill michel-create-pr-with-screenshots -a codex`. Or copy the skill folder (scripts/michel/michel-create-pr-with-screenshots in PackmindHub/packmind) into .agents/skills/michel-create-pr-with-screenshots in your project. Codex loads it when a task matches its description.

Can I use Michel Create PR With Screenshots 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 PackmindHub/packmind --skill michel-create-pr-with-screenshots -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/michel-create-pr-with-screenshots, .gemini/skills/michel-create-pr-with-screenshots, .github/skills/michel-create-pr-with-screenshots and .opencode/skills/michel-create-pr-with-screenshots in your project.

What does Michel Create PR With Screenshots need to run?

Going by SKILL.md and its folder, Michel Create PR With Screenshots needs the command-line tools its instructions call (git).

Does Michel Create PR With Screenshots access the network?

SKILL.md names 1 domain. In commands or code: github.com; the agent is likely to contact it when it follows the instructions. This is read from the text; nothing was executed.

Is Michel Create PR With Screenshots 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 Michel Create PR With Screenshots use?

Michel Create PR With Screenshots is published under the Apache-2.0 licence (the repository's licence). It allows redistribution, so the full SKILL.md is shown on this page.

How many tokens does Michel Create PR With Screenshots use?

About 1.6k tokens (SKILL.md is roughly 6.6k 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 Michel Create PR With Screenshots?

Skills that share tags, products or a category with Michel Create PR With Screenshots: PR Babysitter (openinterpreter/openinterpreter, 69k stars), Check PR (onyx-dot-app/onyx, 32k stars), Contributor-First PR Merge (HKUDS/OpenHarness, 16k stars) and Create Pull Request (cline/cline, 70k stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.

Who maintains Michel Create PR With Screenshots?

PackmindHub (a GitHub organization) maintains it in PackmindHub/packmind, which has 318 GitHub stars. The repository holds 35 skills in this directory. The repository was last updated on October 9, 2026.

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