Agent skill

Kototoro Artwork Chrome Artifacts

by Kototoro-app in Kototoro-app/Kototoro

Shadow bleed and sibling Kototoro chrome artifacts that appear only with an artwork/image background — a nested pale plate, an octagon-shaped light island, or a dark rim inside top-bar pills, the…

Apache-2.0Auto-check passed

Install Kototoro Artwork Chrome Artifacts

skills CLI
$ npx skills add Kototoro-app/Kototoro --skill kototoro-artwork-chrome-artifacts -a claude-code

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

GitHub CLI
$ gh skill install Kototoro-app/Kototoro kototoro-artwork-chrome-artifacts --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/Kototoro-app/Kototoro.git skills-src && mkdir -p .claude/skills && cp -r skills-src/.codex/skills/kototoro-artwork-chrome-artifacts .claude/skills/kototoro-artwork-chrome-artifacts && 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
kototoro-artwork-chrome-artifacts
GitHub stars
613
Token cost
~1.3k tokens
SKILL.md length
642 words
Files
3
Skills in repo
10
Repo updated
First seen
Licence
Apache-2.0

At a glance

Shadow bleed and sibling Kototoro chrome artifacts that appear only with an artwork/image background — a nested pale plate, an octagon-shaped light island, or a dark rim inside top-bar pills, the…

  • Works in 4 steps: Read the live config. adb shell run-as… → Flip one variable per capture. Each flip… → Measure, don't look. A rotating backdrop… → …
  • SKILL.md covers The rule: shadow bleed, Read the exemption before the…, Diagnosis loop (no rebuild) and Editing prefs on device, plus 2 more sections
  • Runs Python scripts from its folder; calls adb

What it does

Kototoro Artwork Chrome Artifacts is an agent skill from Kototoro-app/Kototoro. Shadow bleed and sibling Kototoro chrome artifacts that appear only with an artwork/image background — a nested pale plate, an octagon-shaped light island, or a dark rim inside top-bar pills, the search button, bottom nav and other GlassSurface panels — plus the no-rebuild loop that locates which layer draws any Compose visual artifact, through prefs-only A/B, pixel metrics and pinned-library bytecode.

Its SKILL.md is about 1.3k tokens, which your agent loads only when the skill is triggered. The skill folder holds 3 other files (for example `agents/openai.yaml` and `artwork_probe.py`).

The repository describes itself as: Manga, Novel, and Video reader for Android. The licence is Apache-2.0.

Example prompts

  • “/kototoro-artwork-chrome-artifacts”

Requirements

  • Python 3

Workflow steps

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

  1. Read the live config. adb shell run-as cat shared_prefs/_preferences.xml. This family reproduces with…
  2. Flip one variable per capture. Each flip removes the artifact for a different reason, so the pair localises the layer
  3. Measure, don't look. A rotating backdrop defeats absolute thresholds, so use interior uniformity: the p5–p95 luminance spread inside the…
  4. Confirm API behaviour in the pinned library. Wrong fixes here start from a guessed widget default. IconButton in this project's material3…

What it can do on your machine

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

    Ships script files (Python), which the agent can run.

    Shell commands in SKILL.md call:

    • adb

    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

Kototoro Artwork Chrome Artifacts loads about 1.3k tokens when it runs. Until then it costs about 110 tokens; SKILL.md has 642 words of instructions outside code blocks.

Always · name and description, kept in context so the agent knows when to use it
~110
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 Kototoro-app/Kototoro at commit 74bd979, republished under its Apache-2.0 licence (© Kototoro-app). 642 words, ~1,289 tokens.

Download SKILL.mdSave it as .claude/skills/kototoro-artwork-chrome-artifacts/SKILL.md (or your agent's skills folder). This skill also uses 2 other files; get the full folder from GitHub.
name
kototoro-artwork-chrome-artifacts
description
Shadow bleed and sibling Kototoro chrome artifacts that appear only with an artwork/image background — a nested pale plate, an octagon-shaped light island, or a dark rim inside top-bar pills, the search button, bottom nav and other GlassSurface panels — plus the no-rebuild loop that locates which layer draws any Compose visual artifact, through prefs-only A/B, pixel metrics and pinned-library bytecode.

Kototoro Artwork Chrome Artifacts

For Kototoro-only chrome artifacts over an artwork background. The glass stack is the vendored Kyant Backdrop — module backdrop/, package com.kyant.backdrop — so load the backdrop skill alongside this one whenever the affected code imports it.

The rule: shadow bleed

A Material3 Surface whose color is translucent cannot hide its own shadow. The shadow draws behind the shape, reads through the fill as a dark rim hugging the inside of the outline, and leaves a smaller, brighter plate in the middle. Kototoro makes every glass role translucent over artwork (chrome 0.65–0.92, cards 0.40–0.74), so the shadow paints the artifact and no tint or alpha tuning can remove it.

kotlin
internal fun resolveFallbackShadowElevation(
    styleShadowElevation: Dp,
    containerAlpha: Float,
    flat: Boolean,
): Dp = if (flat || containerAlpha < 1f) 0.dp else styleShadowElevation

GlassSurface's Material fallback routes through it, and so must any hand-rolled Surface(color = …translucent…, shadowElevation = …). Over artwork the hairline border already carries the edge, so dropping the shadow costs depth and nothing else.

Read the exemption before the symptom

"Every screen except X" names the mechanism. The details page was exempt because it is the only caller of TopBarControlSurface(fallbackContainerColor = …) — the one branch that forces copy(alpha = 1f). Read X's code early; it usually differs in exactly the layer under suspicion.

Diagnosis loop (no rebuild)

Style preferences alone add and remove this family of artifact, so keep the loop on prefs and pixels.

  1. Read the live config. adb shell run-as <pkg> cat shared_prefs/<pkg>_preferences.xml. This family reproduces with interface_style=MATERIAL_3_EXPRESSIVE + background_style=DYNAMIC_ARTWORK_GALLERY. Done when both style values are read from the device rather than assumed from the report.

  2. Flip one variable per capture. Each flip removes the artifact for a different reason, so the pair localises the layer:

    • background_style=DEFAULT makes fills opaque; artifact gone ⇒ the fill's transparency is load-bearing.
    • interface_style=IOS switches to the kyant drawBackdrop path; artifact gone ⇒ the Material fallback draws it. Done when each surviving candidate is eliminated by its own capture.
  3. Measure, don't look. A rotating backdrop defeats absolute thresholds, so use interior uniformity: the p5–p95 luminance spread inside the shape, discarding icon pixels below 150. Artifact reads 17.0 on a 44dp capsule; clean reads 1–2. The bright region's bounding box also sizes the culprit — 99px is a 30.5dp nested plate, 135px is the whole 44dp capsule. Done when before/after numbers come from the same mask over a matching backdrop.

  4. Confirm API behaviour in the pinned library. Wrong fixes here start from a guessed widget default. IconButton in this project's material3 passes tonalElevation = 0f / shadowElevation = 0f while the call site sets containerColor = Transparent, so it draws nothing and any fix aimed at it is wasted — as one was. Check the AAR before blaming a widget: javap -p -c -classpath <extracted classes.jar> androidx.compose.material3.IconButtonKt Done when the suspect's real colours and elevations are quoted from bytecode or from the call site.

Show full SKILL.md (192 more words)Show less

Editing prefs on device

adb shell re-parses your command with the device shell, which consumes $ and >. Style values are ASCII enum names, so:

  • Change a value: adb shell run-as <pkg> sed -i s/OLD/NEW/ <prefs>.
  • Insert or delete a line: push a script file and run it, sidestepping inline quoting. adb push x.sed /data/local/tmp/ && adb shell chmod 644 /data/local/tmp/x.sed adb shell run-as <pkg> sed -i -f /data/local/tmp/x.sed <prefs>
  • Force-stop before editing so the app cannot flush over the file; restore the reported values and a closing </map> when done.

Pixel analysis without PIL

artwork_probe.py in this folder decodes PNG through zlib + numpy and prints the uniformity metric, the band map and the nested-plate signature — no imaging library needed on this machine. Pull captures to a file instead of redirecting adb exec-out: PowerShell rewrites > output as UTF-16 and corrupts the PNG.

Closing the loop

  • Put the policy in a pure function and pin it with unit tests, e.g. :app:testDebugUnitTest --tests "…GlassSurfacePolicyTest".
  • Compile and install the real build, then re-measure the same mask on the device; extract the numbers rather than describing the screenshot.
  • Restore the user's original prefs and remove capture scratch before reporting.

© Kototoro-app, 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

SKILL.md and 2 other files in .codex/skills/kototoro-artwork-chrome-artifacts of Kototoro-app/Kototoro.

  • SKILL.md
  • agents/openai.yaml
  • artwork_probe.py

Open the folder on GitHubat commit 74bd979

Compare with similar skills

Kototoro Artwork Chrome Artifacts 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.

Kototoro Artwork Chrome Artifacts compared with similar skills
SkillStarsUsed inTokensAuto-checkLicenceRepo updated
Kototoro Artwork Chrome Artifacts this skillKototoro-app/Kototoro613—~1.3kAutomated safety check: PassApache-2.0
Artifacts Buildernexu-io/open-design100k—~347Automated safety check: PassApache-2.0
Web Artifacts Builderanthropics/skills180k40 repos~769Automated safety check: PassApache-2.0
Web Artifacts Buildernexu-io/open-design100k—~337Automated safety check: PassApache-2.0
Web Artifacts Buildersickn33/agentic-awesome-skills47k3 repos~824Automated safety check: PassApache-2.0
Claude In Chromeasgeirtj/system_prompts_leaks69k—~1.2kAutomated safety check: PassCC0-1.0

Similar skills

  • Artifacts Builder

    nexu-io/open-design

    Suite of tools for creating elaborate, multi-component claude.ai HTML artifacts using modern frontend web technologies (React, Tailwind CSS, shadcn/ui).

    100k GitHub stars~347 tokensUpdated yesterday
    Frontend & DesignAuto-check passed
  • Web Artifacts Builder

    anthropics/skills

    Official

    Builds multi-component claude.ai HTML artifacts as a small React, TypeScript and Tailwind project, then bundles it into one shareable HTML file.

    180k GitHub starsUsed in 40 repos~769 tokens
    Frontend & DesignAuto-check passed
  • Web Artifacts Builder

    nexu-io/open-design

    Build complex claude.ai HTML artifacts with React and Tailwind.

    100k GitHub stars~337 tokensUpdated yesterday
    Frontend & DesignAuto-check passed
  • Web Artifacts Builder

    sickn33/agentic-awesome-skills

    To build powerful frontend claude.ai artifacts, follow these steps:

    47k GitHub starsUsed in 3 repos~824 tokens
    Frontend & DesignAuto-check passed
  • Claude In Chrome

    asgeirtj/system_prompts_leaks

    Automates your Chrome browser to interact with web pages - clicking elements, filling forms, capturing screenshots, reading console logs, and navigating sites.

    69k GitHub stars~1.2k tokensUpdated yesterday
    Productivity & AutomationAuto-check passed
  • Artifact Diagramming

    asgeirtj/system_prompts_leaks

    Diagramming know-how for Artifacts - when a picture earns its place, how to draw one that shows the real mechanism, and the inline-SVG mechanics that keep it legible in both themes.

    69k GitHub stars~1k tokensUpdated yesterday
    Auto-check passed

More from Kototoro-app/Kototoro

All 10 skills in this repo
  • Android Architecture Reference

    Kototoro-app/Kototoro

    Android 架构、依赖注入、数据层、测试规范官方参考。涵盖 UDF/MVI 模式、Hilt/Dagger、Room、Paging、 DataStore、WorkManager、ViewModel、测试策略等。安卓开发第一要义:参考官方文档和案例!

    613 GitHub stars~1.7k tokensUpdated 2 days ago
    Auto-check passed
  • Android Compose Reference

    Kototoro-app/Kototoro

    Jetpack Compose 官方示例与最佳实践参考。涵盖 Compose UI 实现、动画、手势、导航、Material3 主题、 性能优化、测试等所有方面。安卓开发第一要义:参考官方文档和案例!

    613 GitHub stars~1.3k tokensUpdated 2 days ago
    Auto-check passed
  • Android Official Samples

    Kototoro-app/Kototoro

    Android 官方示例代码库完整索引。涵盖架构、Compose UI、性能、测试、存储、网络、相机、媒体、安全等所有领域。

    613 GitHub stars~3.6k tokensUpdated 2 days ago
    Auto-check passed
  • Compose Idle Redraw

    Kototoro-app/Kototoro

    诊断 Kototoro 主壳"空闲永不定居"式 Compose 自持重绘循环(idle 帧数不为 0). An agent skill from Kototoro-app/Kototoro.

    613 GitHub stars~1.9k tokensUpdated 2 days ago
    Auto-check passed
  • Kototoro Browse Source Scroll

    Kototoro-app/Kototoro

    Diagnose and fix Kototoro Browse/Explore page content source scrolling jank when many sources exist.

    613 GitHub stars~793 tokensUpdated 2 days ago
    Auto-check passed
  • Diagnose and fix Kototoro Android issues where returning from reader or video player to details causes flicker, cover reload, panorama reload, progress reset, status bar jump, Compose subtree…

    613 GitHub stars~946 tokensUpdated 2 days ago
    Auto-check passed

Questions about Kototoro Artwork Chrome Artifacts

What does Kototoro Artwork Chrome Artifacts do?

Shadow bleed and sibling Kototoro chrome artifacts that appear only with an artwork/image background — a nested pale plate, an octagon-shaped light island, or a dark rim inside top-bar pills, the…. Kototoro Artwork Chrome Artifacts is an agent skill from Kototoro-app/Kototoro. Shadow bleed and sibling Kototoro chrome artifacts that appear only with an artwork/image background — a nested pale plate, an octagon-shaped light island, or a dark rim inside top-bar pills, the search button, bottom nav and other GlassSurface panels — plus the no-rebuild loop that locates which layer draws any Compose visual artifact, through prefs-only A/B, pixel metrics and pinned-library bytecode.

How do I install Kototoro Artwork Chrome Artifacts in Claude Code?

Run `npx skills add Kototoro-app/Kototoro --skill kototoro-artwork-chrome-artifacts -a claude-code`. Or copy the skill folder (.codex/skills/kototoro-artwork-chrome-artifacts in Kototoro-app/Kototoro) into .claude/skills/kototoro-artwork-chrome-artifacts in your project. Claude Code loads it when a task matches its description.

How do I install Kototoro Artwork Chrome Artifacts in Codex?

Run `npx skills add Kototoro-app/Kototoro --skill kototoro-artwork-chrome-artifacts -a codex`. Or copy the skill folder (.codex/skills/kototoro-artwork-chrome-artifacts in Kototoro-app/Kototoro) into .agents/skills/kototoro-artwork-chrome-artifacts in your project. Codex loads it when a task matches its description.

Can I use Kototoro Artwork Chrome Artifacts 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 Kototoro-app/Kototoro --skill kototoro-artwork-chrome-artifacts -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/kototoro-artwork-chrome-artifacts, .gemini/skills/kototoro-artwork-chrome-artifacts, .github/skills/kototoro-artwork-chrome-artifacts and .opencode/skills/kototoro-artwork-chrome-artifacts in your project.

What does Kototoro Artwork Chrome Artifacts need to run?

Going by SKILL.md and its folder, Kototoro Artwork Chrome Artifacts needs Python for the scripts in its folder and the command-line tools its instructions call (adb). Our summary lists: Python 3.

Does Kototoro Artwork Chrome Artifacts 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 Kototoro Artwork Chrome Artifacts 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 Kototoro Artwork Chrome Artifacts use?

Kototoro Artwork Chrome Artifacts 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 Kototoro Artwork Chrome Artifacts use?

About 1.3k tokens (SKILL.md is roughly 5.2k 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 Kototoro Artwork Chrome Artifacts?

Skills that share tags, products or a category with Kototoro Artwork Chrome Artifacts: Artifacts Builder (nexu-io/open-design, 100k stars), Web Artifacts Builder (anthropics/skills, 180k stars), Web Artifacts Builder (nexu-io/open-design, 100k stars) and Web Artifacts Builder (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 Kototoro Artwork Chrome Artifacts?

Kototoro-app (a GitHub organization) maintains it in Kototoro-app/Kototoro, which has 613 GitHub stars. The repository holds 10 skills in this directory. The repository was last updated on October 9, 2026.

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