Menu
Use when creating or updating the README splash image for Shisho
Install with Codex or Claude Copy this prompt, paste it into Codex, Claude, or another assistant, and let it review the skill page and install it for you.
Based on SOC occupation classification
Use when creating or updating favicon files, app icons, or PWA icons for Shisho
Use when adding, removing, or significantly modifying a metadata field on books or files (e.g., adding a new field like "language" to the File model). Enumerates the cross-stack touchpoints, enforces a discovery-based workflow that uses the codebase itself as the checklist, and includes a verification phase that catches parallel code paths that would otherwise be missed.
| name | splash |
| description | Use when creating or updating the README splash image for Shisho |
Shisho's README splash is a 900x600 PNG with the logo on a dark gradient background. Generated from HTML using Playwright screenshots.
assets/splash.pngassets/splash.html| Element | Value |
|---|---|
| Background | Radial gradient: #3d3d3d center → #1a1a1a edge |
| Purple glow | rgba(139, 92, 246, 0.15) ellipse behind logo |
| Font | Noto Sans, 700 weight |
| Text color | #fafafa (white) |
| Font size | 108px |
| Letter spacing | 0.03em |
| Kanji size | 64.8px (0.6 × main font) |
| Kanji color | #c4b5fd (violet-300) |
| Icon size | 96x96px |
| Icon-text gap | 16px |
The splash is rendered from assets/splash.html:
python3 -m http.server 8770http://localhost:8770/assets/splash.htmlassets/splash.png| Property | Logo.tsx | splash.html |
|---|---|---|
| Letter spacing | 0.05em (tracking-wider) | 0.03em |
| Icon margin | mr-1 (4px) | 16px gap |
| Font | System font stack | Noto Sans |
The splash uses tighter letter spacing and larger icon gap for the larger display size.
assets/splash.html - Editable HTML sourceassets/splash.png - Generated PNG for README