真实产出
在我们的机器上用本 Skill 渲染，未经修饰。
Grid-Paper Beverage Brand Site
如何使用
- 1
复制安装提示
登录后点击右侧黑色按钮，一键复制。
- 2
粘贴给你的 agent
在 Claude Code、Codex、Cursor 等工具里粘贴发送，它会自己装好。
- 3
用一句话调用
像下面这样说出你要做的东西，agent 会按这个 Skill 的流程来做。
你：
/gridpaper-beverage-brand-site 帮我做：Oat, juice, coffee, tea, kombucha or snack brands that want a cheerful sticker-and-carton personality示例对话，仅演示调用方式，不代表实际产出。
你会得到
- A full brand shop: home, product, collection and recipe pages, our story, stockists with a map, wholesale, FAQ, delivery, contact, newsletter, bag, checkout and legal pages
- The grid-paper look: warm paper with fine grid lines, heavy condensed headlines, outlined flavor-tinted cards, a five-photo hero fan with stickers and a cobalt footer wordmark
- Working shop details: a bag drawer with a free-delivery meter, size and subscription pricing, search, filters, a recipe servings scaler and checkout with validation
- Oat, juice, coffee, tea, kombucha or snack brands that want a cheerful sticker-and-carton personality
适合
- Oat, juice, coffee, tea, kombucha or snack brands that want a cheerful sticker-and-carton personality
- Small consumer brands that need shop, recipes or rituals, stockists and support pages designed as one family
- Founders who want a believable storefront before connecting real payments, or a design to port into their own project
- Quiet luxury or corporate brands: heavy condensed type, stickers and flavor colors are deliberately loud and playful
不适合
- Quiet luxury or corporate brands: heavy condensed type, stickers and flavor colors are deliberately loud and playful
- Stores that need real payments, accounts or order delivery today: the bag and checkout confirm on the page and say nothing was charged
- One-screen teasers: the Skill builds a whole connected site, so a single landing section would waste most of it
你需要
- Claude Code、Codex 或 Cursor
- 以本地 skill 目录形式提供
- 许可证
- Skilloop Free
- 作者
- @Skilloop
- 版本
- v1.0.2
- 产出
- 网页
- 生成方式
支持:Claude CodeCodexCursor
由 Skilloop 制作与维护（Pro）。下方每个样例都由这个 Skill 原样产出。源码包为专有授权，非 MIT。
安装包内容
- gridpaper-beverage-brand-site/SKILL.md
- gridpaper-beverage-brand-site/references/framework-adaptation.md
- gridpaper-beverage-brand-site/references/icon-library.md
- gridpaper-beverage-brand-site/references/image-plan.md
- gridpaper-beverage-brand-site/references/images/box.webp
- gridpaper-beverage-brand-site/references/images/cafe.webp
- gridpaper-beverage-brand-site/references/images/farm.webp
- gridpaper-beverage-brand-site/references/images/founders.webp
- gridpaper-beverage-brand-site/references/images/mill.webp
- gridpaper-beverage-brand-site/references/images/p-barista.webp
- gridpaper-beverage-brand-site/references/images/p-berry.webp
- gridpaper-beverage-brand-site/references/images/p-cocoa.webp
- gridpaper-beverage-brand-site/references/images/p-coffee.webp
- gridpaper-beverage-brand-site/references/images/p-matcha.webp
- gridpaper-beverage-brand-site/references/images/p-original.webp
- gridpaper-beverage-brand-site/references/images/p-vanilla.webp
- gridpaper-beverage-brand-site/references/images/picnic.webp
- gridpaper-beverage-brand-site/references/images/r-latte.webp
- gridpaper-beverage-brand-site/references/images/r-pancakes.webp
- gridpaper-beverage-brand-site/references/images/r-porridge.webp
- gridpaper-beverage-brand-site/references/images/r-smoothie.webp
- gridpaper-beverage-brand-site/references/images/recipe-bread.webp
- gridpaper-beverage-brand-site/references/images/recipe-cocoa.webp
- gridpaper-beverage-brand-site/references/images/table.webp
- gridpaper-beverage-brand-site/references/images/team.webp
- gridpaper-beverage-brand-site/references/interior-pages.md
- gridpaper-beverage-brand-site/references/motion-system.md
- gridpaper-beverage-brand-site/references/page-library.md
- gridpaper-beverage-brand-site/references/quality-checklist.md
- gridpaper-beverage-brand-site/references/reui-components.md
- gridpaper-beverage-brand-site/references/route-inventory.md
- gridpaper-beverage-brand-site/references/style-guide.md
- gridpaper-beverage-brand-site/references/template.html
- gridpaper-beverage-brand-site/references/visual-contract.md
- gridpaper-beverage-brand-site/scripts/inline-assets.mjs
- gridpaper-beverage-brand-site/scripts/validate-design.mjs
SKILL.md
Build a complete, shoppable brand website on warm grid paper: heavy condensed headlines, outlined cards with hard ink shadows, a rotated photo fan with stickers in the hero, and one playful color per flavor. Product, collection and…
其他安装方式
登录状态下可直接下载 ZIP。若用 curl 安装，请在「设置 → API 密钥」创建密钥并设置 SKILLHUB_API_KEY。
安装提示词（粘贴给你的 Agent）
This is a free Skilloop skill (Grid-Paper Beverage Brand Site). Download https://skilloop.dev/downloads/free/gridpaper-beverage-brand-site.zip (or use the install command on the skill page), then unzip into ~/.claude/skills or ~/.agents/skills so gridpaper-beverage-brand-site/SKILL.md exists. Or: Read https://skilloop.dev/skills/gridpaper-beverage-brand-site/install.md and follow the instructions.
一行命令安装（下载 + 解压） · Claude Code
mkdir -p ~/.claude/skills && curl -fsSL https://skilloop.dev/downloads/free/gridpaper-beverage-brand-site.zip -o /tmp/gridpaper-beverage-brand-site.zip && unzip -oq /tmp/gridpaper-beverage-brand-site.zip -d ~/.claude/skills/
一行命令安装（下载 + 解压） · Codex / Cursor
mkdir -p ~/.agents/skills && curl -fsSL https://skilloop.dev/downloads/free/gridpaper-beverage-brand-site.zip -o /tmp/gridpaper-beverage-brand-site.zip && unzip -oq /tmp/gridpaper-beverage-brand-site.zip -d ~/.agents/skills/
手动安装 · Claude Code
# Free skill — download the public ZIP (no sign-in): mkdir -p ~/.claude/skills && curl -fsSL https://skilloop.dev/downloads/free/gridpaper-beverage-brand-site.zip -o /tmp/gridpaper-beverage-brand-site.zip && unzip -oq /tmp/gridpaper-beverage-brand-site.zip -d ~/.claude/skills/
