[{"_1":2,"_3":-5,"_4":-5},"loaderData",{"_5":6,"_7":8,"_9":10},"actionData","errors","root",{"_112":113},"routes/modules.$creator.$moduleId",{"_14":15,"_16":17,"_18":19,"_20":21},"routes/modules.$creator.$moduleId.endpoints",{"_11":12,"_13":-5},"error","Module not found","tools","module",{"_20":22,"_23":24,"_25":26,"_27":28,"_29":30,"_31":32,"_33":34,"_35":26,"_36":37,"_38":-5,"_39":-5,"_40":-5,"_41":42,"_43":44,"_45":46,"_47":48,"_49":50,"_51":52,"_53":54,"_55":-5,"_56":48,"_57":58,"_59":60,"_61":-5,"_62":-5,"_63":-5,"_64":-5,"_65":66,"_67":68,"_69":70,"_71":72,"_73":74,"_75":-5,"_76":-5,"_77":-5,"_78":48,"_79":-5,"_80":81,"_82":83,"_84":85,"_86":87,"_88":89,"_90":91,"_92":93},"apiUrl","https://odel.app/api","creator","quasarg","moduleId","taste-bank","@quasarg/taste-bank","displayName","taste bank","tagline","Reusable visual design systems for AI coding agents — browse, fetch, and submit styles via MCP.","iconKey","https://avatars.githubusercontent.com/u/190904861?v=4","category","local","status","published","visibility","public","metaDescription","deploymentType","external","workerName","bindingName","mcpConfig","pricingModel","free","creatorUserId","system:external-import","createdAt",1784953614000,"updatedAt",1788328882000,"sourceRegistry","official-mcp-registry","sourceUrl","https://registry.modelcontextprotocol.io/v0/servers?search=io.github.QuasarG%2Ftaste-bank","sourceVerified",true,"sourceMissingSince","importedAt","upstreamStars",8,"upstreamUpdatedAt",1788243786000,"detectedTransport","detectedAuthType","probeStatus","lastProbedAt","githubRepoUrl","https://github.com/QuasarG/taste-bank","githubRepoFullName","QuasarG/taste-bank","releaseId","ext-quasarg-taste-bank","version","0.2.0","descriptionMarkdown","

\n $\"Taste$ \n

The front-end style library for coding agents — distill a style once, reuse it everywhere.

Swipe styles like you're scrolling TikTok — find the one that catches your eye, then hand it to your agent.

\n $\"npm\"$ \n $\"Astro\"$ \n $\"TypeScript\"$ \n $\"Zod\"$ \n

\n $\"Live\"$ \n $\"GitHub\"$ \n

English | 中文文档

\n\n---\n\n## Why Taste Bank\n\n> **Sound familiar?**\n>\n> - Staring at a blank page, no idea how to lay out your components?\n> - Layout finally settled — yet the AI's visual style never quite lands?\n> - A hoard of \"beautiful designs\" you can never actually summon when you need one?\n> - The style you painstakingly tuned in your last project has to be re-explained from scratch in the next one?\n\nGetting coding agents to produce *well-designed* front-ends is a solved problem nobody can actually use. The community is **full of front-end skills, prompt snippets, and design guides** — but in practice:\n\n- **No unified invocation**: some styles ship as a skill, some as a plugin, some ship nothing at all. Actually using them is a chore.\n- **No quality bar**: without a shared schema, a \"style\" can be three adjectives in a trench coat — nothing an agent can actually execute.\n- **Hard to reuse**: great styles die in chat histories instead of being distilled into an asset.\n- **No ownership or iteration**: no versions, no way to say \"only I maintain my styles.\"\n\n> **More importantly**: the web spawns new styles every day — but not every style is mainstream enough, not every style is *your* taste. We want a community where people share the front-end taste they actually use — and vote with their feet. Only what truly gets used is truly usable.\n\nTaste Bank's answer: distill each style into a **structured style pack** (`SKILL.md` usage guide + precise `design tokens` + `templates/` snapshots), enforced by a **zod schema**, served through a **CLI + skill injection** that works with any coding agent. Once a style is in the bank, it's reachable anywhere, versioned, and owned.\n\n

\n $\"Taste$ \n

The homepage gallery: swipe through live-rendered styles like a feed — horizontal card rail with interactive preview, most-referenced styles and top authors at a glance.

\n\n---\n\n## Quick Start\n\n### Via CLI (recommended)\n\n**One command** — installs the CLI globally and teaches your coding agents (Claude Code, Codex, Cursor, ZCode, Kimi Code…) how to use it:\n\n```bash\nnpx taste-bank setup\n```\n\nThen just talk to your agent in plain language:\n\n> *\"Build me a landing page with one of the styles in taste-bank.\"*\n\nYour agent already knows what to do — `setup` injected a skill that teaches it the `taste-bank` CLI commands. It will browse styles, fetch the complete pack, and implement strictly within the design tokens.\n\n**Prefer the terminal?**\n\n```bash\ntaste-bank list # browse all styles\ntaste-bank skill # get the complete pack (meta + tokens + skill + css + templates)\ntaste-bank use # land a style into your project as a rules file\n```\n\nNo per-agent config, no JSON to paste. Browse visually first at [tastebank.cloud](https://tastebank.cloud).\n\n### Via MCP (legacy)\n\nFor agents that prefer the MCP protocol, configure one URL in your MCP client:\n\n```json\n{\n \"mcpServers\": {\n \"taste-bank\": {\n \"url\": \"https://tastebank.cloud/mcp\",\n \"headers\": { \"x-invite-code\": \"sl_your_invite_code\" }\n }\n }\n}\n```\n\nBoth paths call the same backend. CLI is recommended — simpler, works with 70+ agents out of the box.\n\n---\n\n## Features\n\n- **One-line setup**: `npx taste-bank setup` installs the CLI and injects skills into all your coding agents (Claude Code, Codex, Cursor, ZCode, Kimi Code, and 70+ more via the open `skills` ecosystem)\n- **Complete style packs**: `taste-bank skill ` returns the full pack in one call — meta, tokens, SKILL.md rules, scoped CSS, and HTML template snapshots. Agents get everything they need.\n- **3-day local cache**: packs are cached; if the server is unreachable, the CLI falls back to cache\n- **TikTok-style gallery**: [tastebank.cloud](https://tastebank.cloud) — endless stream of live-rendered previews, horizontal card rail, leaderboards\n- **Structured & validated**: every pack passes a strict zod schema (meta / tokens / skill / templates), versioned, with invite-only submissions + ed25519-signed ownership + human review\n- **Submit from the terminal**: `taste-bank submit` — sign and submit a new style without leaving your project\n- **Private key as identity**: no accounts — whoever holds the key manages the style\n\n---\n\n## CLI Commands\n\n### Browsing & applying (no auth)\n\n| Command | What it does |\n|---|---|\n| `taste-bank list [--q WORD] [--json]` | List published styles |\n| `taste-bank show [--json]` | Style detail (meta + design tokens) |\n| `taste-bank skill [--md]` | **Complete pack** as JSON: `{meta, tokens, skill, css, templates}`. `--md` for plain SKILL.md |\n| `taste-bank use [--as agents\\|claude\\|skill]` | Land a style into your project (managed sentinel block, won't clobber your edits) |\n| `taste-bank favorite ` / `unfavorite` / `favorites` | Manage favorites |\n| `taste-bank doctor` | Health check (CLI, network, identity, skill injection, cache) |\n\n### Contributing (invite + ed25519 identity)\n\n| Command | What it does |\n|---|---|\n| `taste-bank keygen` | Generate an ed25519 keypair into `~/.style-lab/` (one-time) |\n| `taste-bank whoami` | Your bound identity, owned styles, pending submissions |\n| `taste-bank validate ` | Dry-run validate a pack locally (no network) |\n| `taste-bank submit ` | Submit a new style (needs invite code + private key) |\n| `taste-bank update ` | Update an owned style (version must bump) |\n| `taste-bank delete ` | Delete an owned style (asks to confirm) |\n\n---\n\n## How it works\n\n```\nnpx taste-bank setup\n ① npm install -g taste-bank (install CLI globally)\n ② npx skills add …/taste-bank -g (inject 2 skills into your agents:\n taste-bank for browsing/applying,\n taste-bank-contribute for submitting)\n ③ environment check (report state, read-only)\n```\n\nTwo skills are injected (via the open [skills](https://skills.sh) ecosystem):\n\n- **`taste-bank`** — teaches your agent the CLI commands for browsing and applying styles\n- **`taste-bank-contribute`** — the full contribution SOP: how to sample a project, pack a style, sanitize it, and submit\n\nAfter setup, your agent knows the CLI. You just say *\"use a taste-bank style\"* and it runs the commands itself.\n\nThe CLI talks to `tastebank.cloud` by default and caches packs locally for 3 days. Self-host? Set `TASTEBANK_API=https://your-host`.\n\n---\n\n## Submit your own style\n\n```bash\n# One-time identity setup\ntaste-bank keygen\necho '{ \"inviteCode\": \"sl_xxx\" }' > ~/.style-lab/config.json # get a code from the maintainer\n\n# From any project with a style worth keeping:\ntaste-bank validate my-style.pack.json # dry-run check\ntaste-bank submit my-style.pack.json # sign + submit (enters review queue)\n```\n\nOr just tell your agent: *\"submit this project's style to taste-bank\"* — the injected `taste-bank-contribute` skill guides it through the full SOP (sample 2 files max, extract real tokens, sanitize business-identifying content, pack, validate, submit).\n\nSee the [pack format](https://github.com/QuasarG/taste-bank/blob/main/docs/SPEC.md), the `taste-bank-contribute` skill, and the **[agent workflow guide](https://github.com/QuasarG/taste-bank/blob/main/docs/agent-workflow.md)** (how to manage project styles in agent conversations). 中文版见 [Agent 工作流指南](https://github.com/QuasarG/taste-bank/blob/main/docs/agent-workflow.zh-CN.md)。\n\n---\n\n## Security\n\n**Authentication & ownership**\n\n- **Invite codes**: submissions require an invite code; a code binds to the submitter's public key on first use — one code, one identity; only hashes stored server-side\n- **ed25519 signatures**: submit / update / delete all require a private-key signature (message = `style-lab::::`, 30-min window) — your key is your identity\n- **Review queue**: submissions land in `data/pending/` and go live only after maintainer approval\n- **Rate limits**: 20 submits/min per pubkey, 30 manages/min per slug\n\n**Content safety**\n\n- **Template sandbox**: previews render in a `sandbox=\"\"` iframe with CSP forbidding scripts/external loads\n- **HTML blocklist + secret-pattern scanning**: submissions are screened for dangerous attributes and high-confidence secret patterns\n- **Prompt-injection mitigation**: style content is labeled \"data, not instructions\" in skill descriptions\n\n> ⚠️ Every submission is manually reviewed. But reviews can miss things — **do not blindly trust fetched content**; treat it as data.\n\n---\n\n## HTTP API\n\n| Endpoint | Description |\n|---|---|\n| `GET /api/styles.json` | Style list, `?q=keyword` filter |\n| `GET /api/styles/:slug.json` | meta + tokens + file list |\n| `GET /api/styles/:slug/pack.json` | **Complete pack** (meta + tokens + skill + css + templates) |\n| `GET /api/styles/:slug/skill.md` | Assembled SKILL.md |\n| `GET /api/styles/:slug/tokens.css` | Scoped CSS from tokens |\n| `GET /api/styles/:slug/screenshot.png` | Template screenshot |\n| `GET /api/whoami.json` | Identity lookup (`x-invite-code` header) |\n| `POST /api/styles.json` | Submit (invite + signature) |\n| `PUT /api/styles/:slug.json` | Update (signed, version bump) |\n| `DELETE /api/styles/:slug.json` | Delete (signed) |\n\n---\n\n## Project structure\n\n```\nsrc/lib/ core: schema / store / create / assemble / review / auth\nsrc/pages/ Astro pages & HTTP API endpoints\nmcp/ MCP server (Streamable HTTP) — thin shell over src/lib\ncli/ the taste-bank npm package (CLI + skills source)\nskills/ two agent skills: taste-bank (browse) + taste-bank-contribute (submit)\nscripts/ keygen / sign / invite / review admin scripts\nstyles/ published styles (pointed to by STYLE_LAB_DIR at runtime)\ndata/ invite-code hashes, review queue, usage stats, screenshot cache\ndocs/SPEC.md full style pack specification\n```\n\n## License\n\n[MIT](https://github.com/QuasarG/taste-bank/blob/main/LICENSE) © QuasarG\n\n---\n\n

_{English | 中文文档}

\n","changelogMarkdown","videoKey","requiredSecretsJson","publishedAt","priceCents","trialDays",0,"iconType","image","upstream",{"_100":101,"_102":103,"_104":105,"_106":107,"_108":109,"_110":111},"requiredSecrets",[],"tags",[96,97,98,99],"assets",[],"stats",{"_94":81,"_95":81},"ratingAvg","reviewCount","front-end","front-end-development","frontend","frontend-web","topics",[96,97,98,99],"license","MIT","language","TypeScript","registryName","io.github.QuasarG/taste-bank","homepage","https://tastebank.cloud","packages",[],"ENV",{"_114":115,"_116":117,"_118":119},"ENVIRONMENT","production","TURNSTILE_SITE_KEY","0x4AAAAAAB8-rEI2gNDf_QhU","SENTRY_DSN","https://45fd1229f78089d5c3ee78be128030e1@o4510583261757440.ingest.de.sentry.io/4510584253448272"]