- Installs
- 41
- Last 24h
- —
- Trending rank
- —
- Security
- Not audited
Install
Works with every agent the skills CLI supports.
npx skills add https://github.com/nexu-io/html-anything --skill deck-guizang-editorial- 01
Install
Run the command in your project. The CLI asks which agents to install for.
- 02
Describe the task
Ask your agent for something this skill covers. It loads deck-guizang-editorial automatically when relevant.
- 03
Review the result
The agent follows the SKILL.md steps, scripts and references bundled with the skill.
SKILL.md
The instructions your agent reads when the skill is triggered.
【模板: 贵赞编辑墨水 Deck (Editorial × E-Ink)】 【意图】叙事、观点、分享、个人风格表达。墨纸印刷感, 不要科技感。Inspired by op7418/guizang-ppt-skill Style A。
【调色板 — 5 选 1, 严禁改 hex、严禁混用】
- 🖋 墨水经典 Monocle — ink
#0a0a0b, paper#f1efea, paper-tint#e8e5de, ink-tint#18181a. 默认 / 通用商业 / 科技。 - 🌊 靛蓝瓷 Indigo Porcelain — ink
#0a1f3d, paper#f1f3f5, paper-tint#e4e8ec, ink-tint#152a4a. 科技 / 研究 / 数据。 - 🌿 森林墨 Forest Ink — ink
#1a2e1f, paper#f5f1e8, paper-tint#ece7da, ink-tint#253d2c. 自然 / 可持续 / 文化。 - 🍂 牛皮纸 Kraft Paper — ink
#2a1e13, paper#eedfc7, paper-tint#e0d0b6, ink-tint#3a2a1d. 怀旧 / 人文 / 文学。 - 🌙 沙丘 Dune — ink
#1f1a14, paper#f0e6d2, paper-tint#e3d7bf, ink-tint#2d2620. 艺术 / 设计 / 时尚。
【布局 — 10 个磁带式版式池, 可复用; 数量由【用户内容】决定, 完整覆盖每个要点; 短内容 6-12 张起步, 长内容应更多 (同一版式可在不同章节重复使用)】
- L01 Hero Cover — 居中大字 hero typography + kicker + subtitle + lead paragraph + 底部元数据 row。
- L02 Act Divider — kicker + 8.5-10vw 巨大 headline + 一句引言; 章节切换可反色 (ink ↔ paper)。
- L03 Big Numbers Grid — 3×2 数据卡 (label / 大数字 / 注释)。
- L04 Quote + Image — 左 kicker + headline + body + callout; 右 16:10 图 (基线对齐 baseline 不是 top)。
- L05 Image Grid — 3×2 或 3×1 等高图网格 (26vh 或 22vh); 严格统一高度。
- L06 Pipeline / Flow — 横向编号步骤组, 每步: №X + 标题 + 描述; 支持键盘逐步推进。
- L07 Hero Question — 7vw 全屏单一问句, 按语义断行, 周围极简。
- L08 Big Quote — 5.8vw 巨大衬线引文 + 英文翻译 + 署名 + 日期。
- L09 Before / After — 1:1 split; 左列 opacity .55 (旧/before); 右列 full brightness (新/after)。
- L10 Mixed Media — 8:4 比例; 左大段文字 (kicker / headline / body / callout) + 右 3:4 竖图作辅助。
【设计细节】
- 严禁: 渐变 / drop-shadow / 圆角 / 圆形装饰 / blur / SVG 图标库 / emoji 装饰。
- 字体: Display 用
Playfair Display(英) /Noto Serif SC(中); Body 用Inter/Noto Sans SC; 编号 / 数字偶尔可用 italic 衬线。 - 杂志感细节: kicker 用 11px uppercase letterspacing 0.12em; folio 右下角
01 / 12; 顶部细 hairline rule + 期刊 logo / topic。 - 不许: 数据捏造、Lorem ipsum、占位图片 URL。所有图请用纯 CSS / SVG 内联描绘 (色块 + 简笔)。
- 键盘 ← / → 切换; hash 同步; 单文件 HTML。
FAQ
What does the deck-guizang-editorial skill do?
电子杂志 × 电子墨水; 10 个版面 + 5 套调色板 (墨水/靛蓝瓷/森林墨/牛皮纸/沙丘)
How do I install deck-guizang-editorial?
Run npx skills add https://github.com/nexu-io/html-anything --skill deck-guizang-editorial in your project. The skills CLI detects the agents you use and copies the skill into the right folder. For Claude Code you can also place the skill folder at ~/.claude/skills/deck-guizang-editorial/ (personal) or .claude/skills/deck-guizang-editorial/ (project).
Which AI agents can use deck-guizang-editorial?
Any agent that supports the open Agent Skills format (a folder with a SKILL.md file), including Claude Code, Codex, Cursor, GitHub Copilot, Gemini CLI, Windsurf, Cline, OpenCode and more.
Is deck-guizang-editorial safe to install?
No partner security audit is available yet. Skills can run commands and scripts, so read the SKILL.md and any bundled files before installing.
Who maintains deck-guizang-editorial?
It is published by nexu-io in nexu-io/html-anything. It has 41 recorded installs.
More from nexu-io/html-anything
magazine-poster
nexu-io/html-anything
Open the skill to read its SKILL.md instructions.
Popular frontend & design skills
setup-matt-pocock-skills
mattpocock/skills
Configure this repo for the engineering skills: set up its issue tracker, triage label vocabulary, and domain doc layout. Run once before first use of the other engineering skills.
frontend-design
anthropics/skills
Guidance for distinctive, intentional visual design when building new UI or reshaping an existing one. Helps with aesthetic direction, typography, and making choices that don't read as templated defaults.
hyperframes-animation
heygen-com/hyperframes
All animation knowledge for HyperFrames — atomic motion rules, multi-phase scene blueprints, scene transitions, broader motion-design techniques, AND the seven runtime adapters (GSAP default, plus Lottie, Three.js, Anime.js, CSS keyframes, Web Animations API, TypeGPU). Use for any motion or animation task: pick 2-4 rules and compose, or load a blueprint, or look up runtime-specific API (e.g. GSAP eases / Lottie player / Three.js mixer). Also covers auditing an existing composition's choreography (animation map) and 24 named text-animation effects. HyperFrames-native: single paused timeline, seek-safe, deterministic.
prototype
mattpocock/skills
Build a throwaway prototype to answer a design question. Use when the user wants to sanity-check whether a state model or logic feels right, or explore what a UI should look like.
hyperframes-core
heygen-com/hyperframes
The HyperFrames composition contract — build one renderable project. Use for composition structure, the data- timing attributes, class="clip", tracks, sub-compositions, variables, framework-owned media playback, deterministic-render rules, and validation. Read before writing composition HTML.
vercel-react-best-practices
vercel-labs/agent-skills
React and Next.js performance optimization guidelines from Vercel Engineering. This skill should be used when writing, reviewing, or refactoring React/Next.js code to ensure optimal performance patterns. Triggers on tasks involving React components, Next.js pages, data fetching, bundle optimization, or performance improvements.