illustrated-gallery

illustrated-gallery is a skill for Codex from majiayu000/spellbook. It costs 65 tokens per session (1,334 once invoked), scanned A, original, MIT.

A website-building template for illustrated portfolios, creative studios, and brand showcases. It provides a large artwork area, fixed text, compact navigation, and ASCII dissolve transitions between still images.

In plain words
What is it for?
Use it to create or adapt an illustrated portfolio, studio landing page, or brand showcase. It helps choose and crop artwork, preserve the template's layout, and check responsive behavior.
Why use it?
It removes the need to design the visual layout and interaction pattern from scratch. It also helps keep artwork, text, and cards readable across screen sizes.

Skill for Codex

Written for Codex: agents/openai.yaml present. Also seen: $skill-name invocation.

Good fit Use it to create or adapt an illustrated portfolio, studio landing page, or brand showcase. It helps choose and crop artwork, preserve the template's layout, and check responsive behavior.

Compare 6 skills from other repositories ↓
Install with agentmods
npx agentmods add skills/majiayu000/spellbook/illustrated-gallery
Install

Getting it into your agent

One page per mod, every tool's command on it. A separate URL per tool would split the same page into five that compete with each other.

Any agent
npx skills add majiayu000/spellbook --skill illustrated-gallery
Clone the repo
git clone --depth 1 https://github.com/majiayu000/spellbook

Made for: Codex.

Wrote this? Show the measurements

A badge with what this costs and how it scanned, read live from this page, so it follows the numbers instead of freezing them. Markdown for a README, HTML for a documentation site or a project page.

agentmods badge for illustrated-gallery

README.md
[![agentmods](https://agentmods.dev/badge/skills/majiayu000/spellbook/illustrated-gallery/github.svg)](https://agentmods.dev/skills/majiayu000/spellbook/illustrated-gallery)
Your own site
<a href="https://agentmods.dev/skills/majiayu000/spellbook/illustrated-gallery"><img src="https://agentmods.dev/badge/skills/majiayu000/spellbook/illustrated-gallery/github.svg" alt="Measured on agentmods" height="20"></a>

Or the 80×15 button, for a site that already has a row of RSS and ATOM ones. Only the verdict fits; the numbers stay here.

agentmods 80×15 button for illustrated-gallery

Your own site · 80×15
<a href="https://agentmods.dev/skills/majiayu000/spellbook/illustrated-gallery"><img src="https://agentmods.dev/badge/skills/majiayu000/spellbook/illustrated-gallery.svg" alt="Reviewed on agentmods" width="80" height="20"></a>
Per session 65 Skills are progressive disclosure: only the name and description are preloaded; the body loads when the skill is used.
When invoked 1,334 The whole file, excluding the scripts and references it only reads on demand.
Security scan A 0 findings. A grade says what 26 rules found in the file — not that it is safe.
Origin original No closer match found in the catalogue.
Token cost

What it costs to keep this loaded

Counted locally with the o200k_base tokenizer, which is exact for GPT models; Claude uses its own tokenizer and its counts differ. Treat this as one consistent yardstick across the catalogue rather than a bill. Prices are per million input tokens.

ModelPer sessionOnce invoked
Fable 5.1 $0.00065 $0.01334
Opus 5 $0.00032 $0.00667
Sonnet 5 $0.00013 $0.00267
Haiku 4.5 $0.00006 $0.00133

Measured today against content hash 36b20c9be56f, method: parsed. Prices are Anthropic first-party input rates as of 2026-09-12, from the pricing page.

Security

Grade A, and why

illustrated-gallery scanned grade A with 0 findings against 26 rules in 11 categories — prompt injection, anti-refusal, data exfiltration, privilege escalation, supply chain, agent snooping, system-prompt leakage, SSRF and excessive agency — measured today.

The scan reads SKILL.md. This mod also ships 1 executable file (assets/source/app.js), listed below but not scanned — reading those needs a real analyzer, not pattern matching.

A static scan of the body, not an audit. Every finding is printed with the line that produced it so you can judge whether it matters here. A mod is markdown that instructs an agent; that is exactly why what it instructs is worth reading.

Nothing flagged

None of the 26 patterns this scan looks for appear in this file: no shell pipes, no recursive deletes, no credential paths, no hidden text, no instruction-override or anti-refusal phrasing, no agent-config snooping. That is not a guarantee, it is the absence of the things that are checkable.

skills/illustrated-gallery/SKILL.md · 117 lines

How it starts

The opening of the file, as written. The whole thing — 117 lines — stays where its author put it; the contents beside it link to each section on GitHub.

Create a website from the retained source template. Use artifact-template.json for reference paths. Preserve its visual system and accepted interactions while adapting content to the brief.

Workflow

  1. Inspect the target project and its instructions. For a new site, copy assets/source into a new working directory; leave the skill's source intact. For an existing site, adapt only the requested surface instead of replacing the entire project.
  2. Identify the audience, brand, text, and illustration subjects from the request. The five blue botanical artworks are examples, not mandatory subjects or a fixed image count.
  3. Retain the large artwork stage, fixed text layer, restrained floating card, serif headline hierarchy, and compact navigation unless the user requests changes. Keep images still between transitions.
  4. Replace or generate a coherent image set, then adjust each mobile crop and keep text and cards clear of faces, bird heads, and flower centers.
  5. Validate the complete interaction and responsive layout. Prepare static output only when needed for hosting; use the user's authorized hosting workflow.

Accepted interaction contract

  • Keep the full-frame ASCII dissolve, approximately 1.5 seconds long. Reuse the implementation in app.js; do not substitute an edge wipe or ordinary crossfade as an unsolicited optimization.
  • Keep artwork static. Do not add warping, ripples, floating particles, pointer parallax, or zoom unless explicitly requested. Improve image composition or crop instead when the image feels flat.
  • Treat subject motion, slide transitions, and scroll animation independently. A request to stop image motion must not remove the transition animation.
  • Preserve autoplay, pause, previous/next, direct slide selection, touch swipes, and reduced-motion support. Pause stops autoplay; manual navigation still works.
  • Reuse existing sections without adding dashboards, forms, configuration panels, or theme systems. The sample brief-download form saves a local file; do not describe it as sending a message or collecting a lead.

Read the full file on GitHub · 117 lines

Changes

What this file has done since we first saw it

Hashed on every crawl. A supply-chain change to an agent config is a question of when, not whether, so the history is kept rather than the latest state alone.

  1. today First seen · 117 lines · 65 tokens per session scan A 36b20c9be56f

Subscribe to this mod's changes

illustrated-gallery is a skill published in the GitHub repository majiayu000/spellbook (278 stars, last pushed yesterday), licensed MIT. It adds 65 tokens to every session and 1,334 once invoked, about $0.0003 per session on Opus 5. A static security scan graded it A with 0 findings. No closer match exists in the catalogue, so it is treated as the original; first seen 2026-09-12.

Related

Other skills, from other repositories

pneuma-preferences

Persistent user preference memory across sessions. Consult this skill BEFORE making any design, style, or aesthetic decisions — choosing colors, themes, layouts, fonts, tone of voice, content density, or visual direction. Also consult when starting a new creative task in any mode, when the user corrects your style…

pandazki/pneuma-skills · 100 tokens

Cursor rules for avoiding placeholder or broken image URLs, using stable visual

Cursor rules for avoiding placeholder or broken image URLs, using stable visual assets, and checking alt text, dimensions, licensing, and responsive behavior.

AmariahAK/atlarix-skills · 13 tokens

Tailwind CSS Patterns

Use this skill when styling UI with Tailwind and you want consistent design tokens, maintainable class composition, and good accessibility defaults.

AmariahAK/atlarix-skills · 4 tokens

Cursor rules for embedding Beefree SDK's no-code content editors (for emails, pa

Cursor rules for embedding Beefree SDK's no-code content editors (for emails, pages, and popups) into a web application.

AmariahAK/atlarix-skills · 17 tokens

Guidelines and best practices for building applications with [Beefree SDK](https

Guidelines and best practices for building applications with Beefree SDK, including installation, authentication, configuration, customization, and template management.

AmariahAK/atlarix-skills · 16 tokens

Create Design System

You are an expert design systems architect. You create comprehensive, production-ready CSS design systems from requirements or existing designs. Your output is immediately usable in any modern web project.

AmariahAK/atlarix-skills · 3 tokens