본문으로 건너뛰기
cccskills
무료GitHub에 공개

deck-guizang-editorial

Build a magazine-style presentation with a paper-and-ink look. Ten reusable layouts cover narratives, data, quotes, and comparisons, while five fixed palettes provide consistent styling in a single HTML file with keyboard navigation.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

원문원문 설명 보기

电子杂志 × 电子墨水; 10 个版面 + 5 套调色板 (墨水/靛蓝瓷/森林墨/牛皮纸/沙丘)

nexu-io/html-anything
설치 방법 보기

이럴 때 유용합니다

  • Sharing a viewpoint through a magazine-style presentation
  • Highlighting figures and quotes
  • Explaining steps or before-and-after comparisons
  • Presenting a personal style with a paper-and-ink look

포함된 파일(3)

  • SKILL.md3.5 KB
  • example.html4.8 KB
  • example.md368 B

SKILL.md(원문)

설치하기 전에 에이전트에게 전달되는 지시 내용을 확인할 수 있습니다.

【模板: 贵赞编辑墨水 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。

리뷰

아직 리뷰가 없습니다. 사용해 본 소감을 남겨 주세요.

댓글

로그인 없이 쓸 수 있습니다. 사용 후기, 질문, 작동하지 않은 환경 등을 편하게 남겨 주세요.

아직 댓글이 없습니다. 첫 댓글을 남겨 보세요.

보내면 바로 공개됩니다. 이메일 주소나 전화번호 같은 개인 정보는 쓰지 마세요. URL은 2개까지입니다.

0 / 1,000자

이 양식은 reCAPTCHA로 보호되며 Google 개인정보처리방침 및 서비스 약관이 적용됩니다.

같은 저장소의 스킬

article-magazine

무료

Format long articles for blogs and newsletters with a magazine-style layout inspired by Substack and Medium. A centered text column, contrasting headings, styled quotations, and labeled code blocks give readers clear visual cues throughout the page.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

  • Formatting a long blog article
  • Preparing an essay or newsletter for publication
  • Laying out articles with quotations and code examples
nexu-io/html-anything9.2천2026년 10월 13일 업데이트

article-sketchnote-editorial

무료

Turn a concept’s origins into a magazine-style visual story. Six distinct layouts combine diagrams, annotations, and typography to trace a concrete problem through failed attempts and a turning point, revealing the concept’s name at the end.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

  • Illustrating how a concept emerged
  • Creating visual learning materials about failed attempts
  • Presenting a concept’s history as a magazine feature
nexu-io/html-anything9.2천2026년 10월 13일 업데이트

blog-post

무료

Create magazine-style pages for long blog posts, essays, and case studies. The layout combines readable single-column text with a prominent title, captioned figures, highlighted quotations, author details, and related article cards.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

  • Designing a long-form blog page
  • Presenting an essay with magazine-style typography
  • Laying out a case study with figures and quotations
nexu-io/html-anything9.2천2026년 10월 13일 업데이트

card-twitter

무료

Create a landscape card for an X post, featuring a short quote, insight, or data point. The layout combines prominent text with attribution, a handle, a category label, and a brand watermark.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

  • Sharing a quote with author attribution on X
  • Highlighting a data point in a social post
  • Creating branded cards for short insights
nexu-io/html-anything9.2천2026년 10월 13일 업데이트

card-xiaohongshu

무료

Create a series of Xiaohongshu-style knowledge cards with a cover, focused content cards, and a closing summary. Soft colors, large text, and spacious layouts make the cards suitable for mobile reading and screenshots for social posts.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

  • Turn practical tips into a series of social media cards
  • Explain one key idea per card for mobile readers
  • Prepare card layouts for social post screenshots
nexu-io/html-anything9.2천2026년 10월 13일 업데이트

competitive-teardown

무료

Turn supplied competitor research into a product strategy report. Compare positioning, features, pricing, and user feedback, then identify opportunities and propose actions for the next 30, 90, and 180 days, while marking missing evidence.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

  • Comparing competitors to guide product decisions
  • Reviewing pricing and plan differences
  • Turning research notes into a strategy report
nexu-io/html-anything9.2천2026년 10월 13일 업데이트

nexu-io의 스킬 모두 보기

이 스킬의 문제 신고