deck-open-slide-canvas
Lets your agent create presentations about software architecture. It's useful for explaining technical designs and important decisions to teams.
What it does
This tool creates custom slide presentations. You provide the content, and it arranges it into a visually appealing format following specific design rules.
When to use it
- ✓Creating a personal portfolio.
- ✓Making a unique and creative presentation.
- ✓Developing material for art or design classes.
Example of what to ask your AI
“Create a presentation about art history with the 'Sea Indigo' theme.”
Want more? Open the sections below.
How to use
The easiest way: copy the message below and paste it into Claude, ChatGPT, Cursor or any AI. It reads the skill and follows the instructions.
Skill link
Ready-to-paste message
How it works
The AI organizes your text and images into fixed-size pages, ensuring everything fits without scrollbars. It uses a set of rules for font sizes, spacing, and colors, allowing you to choose the layout for each page.
Installation
Easiest way: copy the skill link and paste it into Claude, ChatGPT or Cursor asking it to follow the instructions.
In the terminal (Claude Code, Codex, Cursor), in your project folder:
npx skills add nexu-io/open-design --skill deck-open-slide-canvasOr download just the file:
curl -L https://raw.githubusercontent.com/nexu-io/open-design/main/plugins/_official/examples/deck-open-slide-canvas/SKILL.md -o SKILL.mdTechnical content (original SKILL.md)
Original text by the author, straight from GitHub.
【模板: 1920 画布自由 Deck】 【意图】不想被模板束缚的场景 (个人作品集、奇特演讲、艺术 / 设计课 deck)。给一个固定 1920×1080 画布 + 极强的类型 / 调色约束, 让 agent 像写 React 组件一样按内容自由排布每一页。Inspired by 1weiho/open-slide。
【硬性技术规格】
- 画布: 每页严格
width: 1920px; height: 1080px;用transform: scale(...)适配视窗 (默认scale(0.7)居中)。 - 绝对禁止 overflow: 每页内容必须 fit in 1920×1080, 不许滚动条出现。
- 字号 type scale (px):
2xs:18 · xs:22 · sm:28 · md:36 · lg:48 · xl:64 · 2xl:88 · 3xl:120 · 4xl:160 · 5xl:220。 - 边距 padding: 96 / 128 / 160 三档之一。
- 每页有
<section class="slide" data-slide-id="<n>">。
【调色板 — 每个 deck 选 1 套, 全程不改】
- 🌫 Ash & Lime — bg
#f1efea, ink#161616, accent#c5e803。 - 🌌 Sea Indigo — bg
#0a0e1a, ink#f5f5f7, accent#5ac8fa。 - 🧉 Mate Mocha — bg
#1a1411, ink#f5e9d6, accent#d97757。 - 🌸 Pearl Rose — bg
#fdf6f3, ink#1a1015, accent#ff5d8f。
【布局自由度 — 这是核心】
- 不强制模板, 每页根据内容性质自选布局: cover / question / quote / image-text / 三列 / 五列 / 列表 / 数据卡 / 满版图。
- 但每页必须遵守一条规则: 视觉重心 (visual hierarchy) 只有 1 个 — 一句金句、一个数字、一张图, 不要"什么都强调"。
- 不许塞两段平等的文字; 真要并列就上 3 列等权重网格。
【字体】
- 西文:
Inter Tight(display) +Inter(body); 或Source Serif Pro(editorial 风时)。 - 中文:
Noto Sans SC(sans 风) 或Noto Serif SC(editorial 风); 不混 sans + serif。 - mono:
JetBrains Mono给数据 / 时间戳。
【设计细节】
- 严禁 emoji 装饰 (内容里的允许); 严禁多色彩虹; accent 只用一个色。
- 严禁 SVG icon 套用 lucide / feather 等通用库 (自己写 inline SVG)。
- 加键盘 ← / → 切换 + hash 同步; 角标固定: 右下
№N/M, 左下 deck title。 - 必须用用户的真实内容; 严禁 lorem ipsum。
- 单文件 HTML; Tailwind CDN; 不要外链图片。
FAQ
Can I use my own colors?
No, you must choose one of the four predefined color palettes (Ash & Lime, Sea Indigo, Mate Mocha, Pearl Rose) and use it throughout the presentation.
What does 'visual hierarchy' mean?
It means each slide should have one main focal point, like an important sentence, a number, or an image, rather than multiple elements competing for attention.
Can I add icons from libraries like Font Awesome?
No, you must create your own icons using inline SVG, without using external libraries.
Details
Original description by the author
OpenDesign's architecture review: the local daemon + agent-runtime design, the tradeoffs, and the decision to lock. Built as a decision-grade product management deck for staff eng, tech leads, security.
repo: nexu-io/open-design
Popularity
- GitHub stars
- 101k
- Ranking position
- #537
- License
- Apache-2.0
- Updated
- 10/16/2026
Comments
- …
More skills from this repository
sample-plugin
Makes your agent create a metadata file for tests. It helps ensure code works correctly in different situations.
nexu-io/open-design
aster-atelier
Helps your agent create an artistic website with a classic look. It uses elegant imagery, blue skies, and serif fonts for a cinematic feel.
nexu-io/open-design
audio-jingle
Makes your agent generate audio like jingles and sound effects. It can create music and voices, saving the result as an audio file.
nexu-io/open-design
blog-post
Helps your agent write long articles or blog posts. It includes space for images, quotes, and author information.
nexu-io/open-design
Similar skills
architecture-decision-records
Has your agent record important project structure decisions. It helps to understand the reasoning behind choices and maintain a clear history of changes.
affaan-m/ECC
code-tour
Lets your agent create step-by-step code walkthroughs with exact file and line anchors. It's useful for project introductions, code explanations, or change reviews. Helps understand how a system works.
affaan-m/ECC
codebase-onboarding
Helps your agent analyze unfamiliar code and create an onboarding guide. It includes an architecture map, entry points, and conventions. Ideal for starting on a new project.
affaan-m/ECC