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

Render Evidence

by yschimke in yschimke/compose-ai-tools

Capture the before/after rendered PNGs a UI-affecting PR in this repository needs as visual evidence, including bringing an Android SDK up in a fresh sandbox.

Apache-2.0Auto-check passedMobile

Install Render Evidence

skills CLI
$ npx skills add yschimke/compose-ai-tools --skill render-evidence -a claude-code

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

GitHub CLI
$ gh skill install yschimke/compose-ai-tools render-evidence --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/yschimke/compose-ai-tools.git skills-src && mkdir -p .claude/skills && cp -r skills-src/.claude/skills/render-evidence .claude/skills/render-evidence && 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
render-evidence
GitHub stars
117
Token cost
~1.4k tokens
SKILL.md length
680 words
Files
1
Skills in repo
3
Repo updated
First seen
Licence
Apache-2.0

At a glance

Capture the before/after rendered PNGs a UI-affecting PR in this repository needs as visual evidence, including bringing an Android SDK up in a fresh sandbox.

  • Works in 4 steps: Commit the PNGs you intend to cite to… → Embed them as markdown images whose URLs… → Write alt plainly and leave any… → …
  • A change touches a Compose @Preview
  • SKILL.md covers Check what already exists first, Rendering, The Android lane needs an SDK;… and Surfaces the @Preview pipeline…, plus 1 more section
  • Calls git

What it does

Render Evidence is an agent skill from yschimke/compose-ai-tools. Capture the before/after rendered PNGs a UI-affecting PR in this repository needs as visual evidence, including bringing an Android SDK up in a fresh sandbox. Use when a change touches a Compose @Preview, a catalog, the VS Code webview, an overlay, a theme, an icon or a fixture, and the PR body needs real pixels.

Its SKILL.md is about 1.4k 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 Mobile, covering Android development and Pull requests. It works with Android, Visual Studio Code, Jetpack Compose and Gradle. The repository describes itself as: Helping the Agents Compose the Things. The licence is Apache-2.0.

When your agent uses it

  • A change touches a Compose @Preview
  • The VS Code webview
  • The PR body needs real pixels

Example prompts

  • “/render-evidence”

Workflow steps

4 steps, taken from the first numbered list in SKILL.md.

  1. Commit the PNGs you intend to cite to your working branch and push.
  2. Embed them as markdown images whose URLs are commit-SHA-pinned
  3. Write alt plainly and leave any backticks that appear alone. They
  4. Verify the pixels actually render on the published page before claiming evidence.

What it can do on your machine

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

    Links to these hosts (documentation or services it may open):

    • 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

Render Evidence loads about 1.4k tokens when it runs. Until then it costs about 83 tokens; SKILL.md has 680 words of instructions outside code blocks.

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

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 yschimke/compose-ai-tools at commit 3f0524a, republished under its Apache-2.0 licence (© yschimke). 680 words, ~1,401 tokens.

Download SKILL.mdSave it as .claude/skills/render-evidence/SKILL.md (or your agent's skills folder).
name
render-evidence
description
Capture the before/after rendered PNGs a UI-affecting PR in this repository needs as visual evidence, including bringing an Android SDK up in a fresh sandbox. Use when a change touches a Compose @Preview, a catalog, the VS Code webview, an overlay, a theme, an icon or a fixture, and the PR body needs real pixels.

Capturing visual evidence

Root AGENTS.md says a UI-affecting PR must carry before/after evidence as embedded, viewable images — describing an image, or deferring to the diff bot's auto-comment, does not count. This is how to produce them here.

Check what already exists first

Rendering is not free. Before capturing anything:

  • Read the sticky <!-- preview-diff --> comment on the PR — CI may already have rendered and diffed exactly the surface you changed.
  • Reuse renders published on the compose-preview/pr and compose-preview/main branches where they cover the change.
  • Scan .github/workflows for the preview-diff CI this repo already runs, and cite it.

The bot's comment is a convenience, not a substitute: your PR body still needs your change's before/after embedded in it.

Rendering

Whole sample modules:

./gradlew :samples:android:composePreviewRenderAll
./gradlew :samples:cmp:composePreviewRenderAll

One preview, which is what a before/after pair usually wants:

./gradlew :samples:android:composePreviewRender --rerun \
  -PcomposePreview.filter=<PreviewFunctionName>

--rerun matters. A failed render leaves .error.json sidecars that count as task outputs, so composePreviewRender goes UP-TO-DATE and re-reports the stale failure. PNGs land under <module>/build/compose-previews/renders/.

The samples consume the plugin through includeBuild("gradle-plugin"), so a plugin edit is picked up with no publish step.

For the before side, render at the base commit (git stash, or a worktree at origin/main) into a separate directory before rendering the head.

The Android lane needs an SDK; the Desktop lane does not

  • Compose Desktop renders headlessly — no DISPLAY, X server or xvfb. Skia's software path draws offscreen. If a desktop render looks broken in a sandbox, it is almost never the windowing system: check the JDK 17 toolchain and the native deps first, per Common commands and docs/DESKTOP_NATIVE_DEPS.md.
  • The Android/Robolectric lane needs an Android SDK, which a fresh container does not have. scripts/install.sh --android-sdk installs it (and a JDK when ./gradlew reports "Unable to download toolchain"). The traps that cost a whole session — chiefly that the platform package for compileSdk = 37 is platforms;android-37.0, not android-37, and that the wrong name fails the entire sdkmanager invocation it appears in, taking the SDK 36 packages down with it — are written up under Bringing up a fresh sandbox. Read that before improvising. Cold end-to-end run is about 3 minutes.

Surfaces the @Preview pipeline does not reach

  • VS Code panel UI (src/webview/, media/preview*.css) has its own capture path: the preview-harness boots the real <preview-app> bundle headlessly against fixture JSON. Loop and fixture authoring are in preview-harness/README.md; seed fixtures are grid-default and a11y-findings.
  • A semantics overlay has a renderable proxy: the compose/semantics-wireframe SVG.
  • Anything genuinely uncapturable here (a three.js webview in a headless container): say so explicitly in the PR body, embed a proxy if one exists, and state how a human or CI verifies it visually. Then treat "nothing renders this yet" as a gap to close in the same or a fast-follow PR — register a fixture or a @Preview with the preview-harness so the next change to that surface is diffed automatically.
Show full SKILL.md (215 more words)Show less

Getting the pixels into the PR

  1. Commit the PNGs you intend to cite to your working branch and push.
  2. Embed them as markdown images whose URLs are commit-SHA-pinned raw.githubusercontent.com links to those pushed files — the same form the diff bot uses. This is not just convention: a ![alt](url) whose host is not a GitHub origin has its ! stripped before it reaches the API, silently, so a deployment URL or a CDN link arrives as a bare link and the evidence is gone. Committing and citing the raw URL is what makes the image survive.
  3. Write ![alt](url) plainly and leave any backticks that appear alone. They are injected between the agent and GitHub, and the PR Body Syntax workflow repairs them in place. The three cases it does not cover — review comments, destinations mangled past recognition, and a picture that still did not render — are in PR workflow.
  4. Verify the pixels actually render on the published page before claiming evidence. WebFetch caches per URL for ~15 minutes; bust it with a throwaway query parameter rather than chasing a bug you already fixed.

A before/after pair whose two images look identical is a finding, not a failure — either the change is not visual, or the render did not pick it up. Say which.

© yschimke, 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 .claude/skills/render-evidence of yschimke/compose-ai-tools.

Open the folder on GitHubat commit 3f0524a

Compare with similar skills

Render Evidence 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.

Render Evidence compared with similar skills
SkillStarsUsed inTokensAuto-checkLicenceRepo updated
Render Evidence this skillyschimke/compose-ai-tools117—~1.4kAutomated safety check: PassApache-2.0
Android Developmentdpconde/claude-android-skill336—~1.7kAutomated safety check: PassMIT
Claude Android NinjaDrjacky/claude-android-ninja124—~5.2kAutomated safety check: PassApache-2.0
Composewebview Developmentparkwoocheol/compose-webview103—~1.3kAutomated safety check: PassMIT
Update Libs VersionsCosminMihuMDC/KtorMonitor254—~800Automated safety check: PassApache-2.0
Android DevelopmentCoWork-OS/CoWork-OS473—~459Automated safety check: PassMIT

Similar skills

  • Android Development

    dpconde/claude-android-skill

    Create production-quality Android applications following Google's official architecture guidance and NowInAndroid best practices.

    336 GitHub stars~1.7k tokensUpdated 10 mo ago
    MobileAuto-check passed

  • Claude Android Ninja

    Drjacky/claude-android-ninja

    Build and migrate Android apps with Kotlin, Jetpack Compose, MVVM, Hilt, Room 3 (KSP, SQLiteDriver, Flow/suspend DAOs), Navigation3, and multi-module Gradle.

    124 GitHub stars~5.2k tokensUpdated 9 days ago
    MobileAuto-check passed

  • Composewebview Development

    parkwoocheol/compose-webview

    Builds, tests, and formats ComposeWebView multiplatform library.

    103 GitHub stars~1.3k tokensUpdated 1 mo ago
    MobileAuto-check passed

  • Update Libs Versions

    CosminMihuMDC/KtorMonitor

    Update dependency versions in gradle/libs.versions.toml by querying Maven repositories.

    254 GitHub stars~800 tokensUpdated 25 days ago
    MobileAuto-check passed

  • Android Development

    CoWork-OS/CoWork-OS

    Android/Kotlin development: Jetpack Compose, Room database, Gradle builds, emulator management, and Play Store submission.

    473 GitHub stars~459 tokensUpdated yesterday
    MobileAuto-check passed

  • Kotlin Android

    ericrisco/rsc-harness

    A skill your agent uses when building or fixing a native Android app in Kotlin and Jetpack Compose on the UDF layered architecture — ViewModel/StateFlow, Hilt, Room, Retrofit, coroutines, type-safe…

    167 GitHub stars~2.9k tokensUpdated yesterday
    MobileAuto-check passed

More from yschimke/compose-ai-tools

  • Flake Triage

    yschimke/compose-ai-tools

    Decide whether a preview the visual-diff bot flagged actually regressed or is simply nondeterministic, using a repeat-render oracle at a single commit.

    117 GitHub stars~1.5k tokensUpdated yesterday
    Auto-check passed

  • Steward

    yschimke/compose-ai-tools

    Drive a pull request on this repository to green — which fast checks to run before pushing, how to read a red check, and what to do about a review comment.

    117 GitHub stars~2k tokensUpdated yesterday
    Auto-check passed

Works with

Categories

Questions about Render Evidence

What does Render Evidence do?

Capture the before/after rendered PNGs a UI-affecting PR in this repository needs as visual evidence, including bringing an Android SDK up in a fresh sandbox. Render Evidence is an agent skill from yschimke/compose-ai-tools. Capture the before/after rendered PNGs a UI-affecting PR in this repository needs as visual evidence, including bringing an Android SDK up in a fresh sandbox.

When should I use Render Evidence?

Render Evidence fits situations like: A change touches a Compose @Preview; the VS Code webview; the PR body needs real pixels.

How do I install Render Evidence in Claude Code?

Run `npx skills add yschimke/compose-ai-tools --skill render-evidence -a claude-code`. Or copy the skill folder (.claude/skills/render-evidence in yschimke/compose-ai-tools) into .claude/skills/render-evidence in your project. Claude Code loads it when a task matches its description.

How do I install Render Evidence in Codex?

Run `npx skills add yschimke/compose-ai-tools --skill render-evidence -a codex`. Or copy the skill folder (.claude/skills/render-evidence in yschimke/compose-ai-tools) into .agents/skills/render-evidence in your project. Codex loads it when a task matches its description.

Can I use Render Evidence 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 yschimke/compose-ai-tools --skill render-evidence -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/render-evidence, .gemini/skills/render-evidence, .github/skills/render-evidence and .opencode/skills/render-evidence in your project.

What does Render Evidence need to run?

Going by SKILL.md and its folder, Render Evidence needs the command-line tools its instructions call (git).

Does Render Evidence access the network?

SKILL.md names 1 domain. As links in the text: github.com. This is read from the text; nothing was executed.

Is Render Evidence 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 Render Evidence use?

Render Evidence 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 Render Evidence use?

About 1.4k tokens (SKILL.md is roughly 5.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 Render Evidence?

Skills that share tags, products or a category with Render Evidence: Android Development (dpconde/claude-android-skill, 336 stars), Claude Android Ninja (Drjacky/claude-android-ninja, 124 stars), Composewebview Development (parkwoocheol/compose-webview, 103 stars) and Update Libs Versions (CosminMihuMDC/KtorMonitor, 254 stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.

Who maintains Render Evidence?

yschimke (a GitHub user) maintains it in yschimke/compose-ai-tools, which has 117 GitHub stars. The repository holds 3 skills in this directory. The repository was last updated on October 7, 2026.

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