惯性聚合 高效追踪和阅读你感兴趣的博客、新闻、科技资讯
阅读原文 在惯性聚合中打开

推荐订阅源

F
Full Disclosure
博客园 - 三生石上(FineUI控件)
MyScale Blog
MyScale Blog
Apple Machine Learning Research
Apple Machine Learning Research
L
LINUX DO - 最新话题
T
The Blog of Author Tim Ferriss
P
Proofpoint News Feed
宝玉的分享
宝玉的分享
小众软件
小众软件
Hugging Face - Blog
Hugging Face - Blog
GbyAI
GbyAI
Cyber Security Advisories - MS-ISAC
Cyber Security Advisories - MS-ISAC
V
Visual Studio Blog
爱范儿
爱范儿
freeCodeCamp Programming Tutorials: Python, JavaScript, Git & More
博客园_首页
CTFtime.org: upcoming CTF events
CTFtime.org: upcoming CTF events
月光博客
月光博客
博客园 - 叶小钗
D
Docker
H
Hackread – Cybersecurity News, Data Breaches, AI and More
T
Tailwind CSS Blog
D
DataBreaches.Net
酷 壳 – CoolShell
酷 壳 – CoolShell
B
Blog RSS Feed
量子位
美团技术团队
Vercel News
Vercel News
Y
Y Combinator Blog
IT之家
IT之家
Martin Fowler
Martin Fowler
OSCHINA 社区最新新闻
OSCHINA 社区最新新闻
S
SegmentFault 最新的问题
腾讯CDC
Recent Announcements
Recent Announcements
Google DeepMind News
Google DeepMind News
罗磊的独立博客
让小产品的独立变现更简单 - ezindie.com
让小产品的独立变现更简单 - ezindie.com
G
Google Developers Blog
Microsoft Azure Blog
Microsoft Azure Blog
The Register - Security
The Register - Security
博客园 - 司徒正美
N
Netflix TechBlog - Medium
S
Schneier on Security
博客园 - 聂微东
U
Unit 42
D
Darknet – Hacking Tools, Hacker News & Cyber Security
Threat Intelligence Blog | Flashpoint
Threat Intelligence Blog | Flashpoint
雷峰网
雷峰网
Latest news
Latest news

Open Design Blog

Claude PPT Skills: How to Make a Slide Deck with Your Coding Agent codex-ppt-skill: Image-Forward PPT Decks with a Coding Agent frontend-slides: Make Web Slides with a Coding Agent dashiAI-ppt-skill: Editable Presentations From a Coding Agent guizang-ppt-skill: Editorial HTML Decks with a Coding Agent Marp: The Markdown Presentation Tool (and How to Export to PowerPoint) ppt-master: Editable PowerPoint From Any Document, Built by an Agent reveal.js: Themes, Export & How It Compares to the Alternatives Slidev: Themes, Examples & How to Export to PowerPoint Open Design AI Workshop is coming to Shanghai Open Design 0.13.0: stay in flow Best AI Design Agents in 2026: An Honest, Tested Guide Best AI Prototyping Tools in 2026: An Honest, Tested Guide Best AI Design Tools in 2026: An Honest, Tested Guide Best Bolt.new Alternatives in 2026: An Honest Comparison Best Design-to-Code Tools in 2026: An Honest, Tested Guide Best Figma Alternatives in 2026: An Honest, Tested Guide How to Use Claude Code for Frontend Design (2026 Guide) Best Lovable Alternatives in 2026: An Honest Comparison Best v0 Alternatives in 2026: An Honest Comparison Open Design is coming to Osaka / Kyoto Open Design 0.12.0: your brand is a design system Vibe Design Tools: An Honest Guide to What Works Vibe Design vs Vibe Coding: Where They Split and Why It Matters Vibe Design with Google Stitch: What It Nails, Where It Traps You What Is Vibe Design? The 2026 Guide to Designing by Intent Open Design 0.11.0: the Bazaar Open Design 0.10.0: the all-in-one design workspace Open Design 0.9.0: design for everyone The open-source alternative to Figma Open Design 0.8.0: everything is a plugin The layout layer the canvas used to hide How to port a Figma workflow into an Open Design plugin BYOK reality check: 5 things that break in Open Design today The open-source alternative to Claude Design BYOK design workflow: run Claude, Codex, or Qwen on your own key Why we built Open Design as a skill layer, not a product
31 skills, 72 systems: how the Open Design library works
Open Design · 2026-05-13 · via Open Design Blog

A walk through the four primitives that make Open Design composable: skills, systems, adapters, and the daemon. With concrete examples of how a Markdown file becomes a pixel-perfect deliverable.

Open Design is, mechanically, four primitives stacked on top of each other:

  1. Skills — what the agent should do
  2. Systems — what the output should look like
  3. Adapters — which agent does the work
  4. The daemon — the loop that wires them together

Each primitive is a folder of files. None of them require a database, a plugin runtime, or a hosted service. This post walks through each in turn and shows what happens when you point your agent at a real brief.

Skills: the unit of capability

A skill is a folder containing one SKILL.md and zero or more supporting files. The Markdown file is the agent’s contract. A typical skill looks like this:

skills/
  guizang-ppt/
    SKILL.md
    templates/
      magazine.html
    examples/
      product-launch.html
      pitch-deck.html

SKILL.md declares the skill’s name, the trigger conditions, the input shape, the output shape, and any inline guidance for the agent. When the daemon boots, it scans skills/ and registers every folder containing a SKILL.md. There is no plugin manifest. There is no version field. There is the file, and the file is the source of truth.

We currently ship 31 skills. Some are deck generators, some produce mobile mockups, some build editorial pages, some write office documents (Word, Excel, PowerPoint). Each one is a folder you can fork, edit, or replace.

Systems: the unit of taste

A system is a DESIGN.md file plus optional reference assets. It describes a visual identity in machine-readable form:

  • Color — OKLch values for foreground, background, accent, error, and so on
  • Type — font stack, weights, the type ramp, line-height conventions
  • Space — base unit, spacing scale, container widths, gutter rules
  • Layout posture — grid choices, asymmetry rules, density preferences
  • Voice — typography of words: tone, vocabulary, sentence rhythm

We ship 72 systems out of the box, including portable versions of Linear, Vercel, Stripe, Apple, Cursor, Figma, and a long tail of editorial and brand systems.

A system is not a Figma library. There are no components, no variants, no nested instances. It is a contract that any agent can read and any human can audit. The cost of writing your own is roughly 30 minutes of focused work.

Adapters: the unit of agent

An adapter is a small TypeScript file in adapters/ that knows how to:

  • detect whether the agent is installed on the user’s $PATH
  • start a session with that agent
  • pipe a skill invocation in
  • collect the output back

We ship adapters for 12 agents today: Claude, Codex, Gemini, Cursor, Copilot, OpenCode, Devin, Hermes, Pi, Kimi, Kiro, Qwen. The daemon auto-detects which ones are present and offers them as a dropdown on first boot.

If you want to add a new adapter, the file is roughly 80 lines of TypeScript and a single register() call. No SDK to learn, no permission to request.

The daemon: the loop that ties it together

The daemon is a small Node process you start with pnpm tools-dev. It does four things:

  1. Detect — scans $PATH for installed agents and skills/ for installed skills, on boot
  2. Discover — opens an interactive question form to pin down surface, audience, tone, scale, and brand context for the current brief
  3. Direct — presents 5 deterministic visual directions (palette in OKLch, font stack, layout posture cues) and asks the user to pick one
  4. Deliver — invokes the selected skill with the locked-in system, lets the agent write to disk, and previews the output in a sandboxed iframe

The whole loop fits in roughly 1500 lines of code. It is intentionally small. The cleverness is in the skills, not in the runtime.

What it feels like in practice

Suppose you want a launch deck for a new product feature. Here’s the flow:

  1. You run pnpm tools-dev in a terminal. The daemon starts on localhost:7780.
  2. You open the URL. The daemon shows you which agents it found (e.g. Claude, Cursor, Codex).
  3. You pick guizang-ppt from the skill list.
  4. A 30-second question form pops up: who’s the audience, what’s the tone, what’s the brand context.
  5. You’re shown 5 visual directions — different palettes, type pairings, layout postures. You pick one.
  6. The agent writes to disk. A sandboxed iframe shows the result. You can export to HTML, PDF, PPTX, ZIP, or Markdown.

The output is real. The files are yours. You can edit them in any editor, hand them to a designer, or feed them back into another skill.

Why files, not a database

Every primitive — skills, systems, adapters — is a folder of text files. There is no central database. There is no “Open Design account.” There is no hosted service that has to keep working for your work to keep working.

This is a deliberate trade. We give up the ability to do clever cross-user analytics, cross-project memory, or hosted collaboration. We get back: portability, longevity, auditability, and the ability for anyone to fork the entire library and ship their own variant.

If you’ve watched a generation of design tools die taking your files with them, you’ll understand why this trade is worth it.