Open Design

๐ŸŽจ The open-source Claude Design alternative. ๐Ÿ–ฅ๏ธ Local-first desktop app. ๐Ÿ–ผ๏ธ Your coding agent becomes the design engine: prototypes, landing pages, dashboards, slides, images & video โ€” real files, HTML/PDF/PPTX/MP4 export. ๐Ÿค– Claude Code / Codex / Cursor / Gemini / OpenCode / Qwen & 20+ CLIs via BYOK.

by nexu-io 83k GitHub stars Apache-2.0 Updated Jul 30, 2026
Open Design skill by nexu-io
Social preview for nexu-io/open-design

Overview

Open Design is an open-source design skill for Claude Code, Cursor, Codex, Gemini CLI, and OpenCode, published by nexu-io. Its author describes it as: โ€œ๐ŸŽจ The open-source Claude Design alternative. ๐Ÿ–ฅ๏ธ Local-first desktop app. ๐Ÿ–ผ๏ธ Your coding agent becomes the design engine: prototypes, landing pages, dashboards, slides, images & video โ€” real files, HTML/PDF/PPTX/MP4โ€ฆโ€. The project has 83k stars on GitHub and is available under the Apache-2.0 license. Add it to your setup with `git clone https://github.com/nexu-io/open-design ~/.claude/skills/open-design`.

Best for

Installation

Add Open Design to your agent with:

git clone https://github.com/nexu-io/open-design ~/.claude/skills/open-design

Review a skillโ€™s source before installing it โ€” skills can instruct your agent to run commands. This command comes from the skillโ€™s public repository, which is the source of truth for setup steps. New to skills? Read how to install Claude Code skills.

Supported agents

License

Open Design is published under the Apache-2.0 license.

Strengths

  • Clear Apache-2.0 license โ€” safe to read and adapt within its terms
  • Ships in nexu-io/open-design, an established project with 82,673 GitHub stars
  • Works with Claude Code, Codex, Cursor, Gemini CLI, OpenCode
  • Actively maintained โ€” repository updated in the last 90 days

Author

nexu-io 102 skills in the catalog ยท GitHub profile โ†—
View skills

Topics

Need a skill like this, tailored to your team?Build a custom skill โ†’

Frequently asked questions

What does Open Design do?
๐ŸŽจ The open-source Claude Design alternative. ๐Ÿ–ฅ๏ธ Local-first desktop app. ๐Ÿ–ผ๏ธ Your coding agent becomes the design engine: prototypes, landing pages, dashboards, slides, images & video โ€” real files, HTML/PDF/PPTX/MP4 export. ๐Ÿค– Claude Code / Codex / Cursor / Gemini / OpenCode / Qwen & 20+ CLIs via BYOK.
How do I install Open Design?
Run git clone https://github.com/nexu-io/open-design ~/.claude/skills/open-design in your agent, then reload your skills. Review the source at https://github.com/nexu-io/open-design before installing.
Is Open Design free to use?
Yes. Open Design is free and open source under the Apache-2.0 license, so you can read, run, and adapt it within that license's terms.
Which agents does Open Design work with?
Open Design lists Claude Code, Codex, Cursor, Gemini CLI, and OpenCode โ€” named in its SKILL.md, its plugin marketplace or its repository topics. Skills use the portable SKILL.md format, so other agents that read that format may load it too.
Where does Open Design come from?
Open Design ships inside nexu-io/open-design, a repository that contains 61 catalogued skills in total. The repository's 82,673 GitHub stars apply to that whole collection, not to this skill on its own.

One-click contribution flow for OpenDesign (nexu-io/open-design) โ€” even for non-coders. Pick one of four cards (ship a Skill or Design System you made with OD; translate docs; fix a typo / write a blog; report a bug), the agent validates and opens a PR (or issue) for you. Trigger words contribute to open design, ship my OD skill, ship my OD design system, translate OD docs, report an OD bug, od-contribute.

โ†‘ GrowingActive Claude Code
97k GitHub stars Apache-2.0 Updated Sep 21, 2026 Free

A long-form article / blog post โ€” masthead, hero image placeholder, article body with figures and pull quotes, author byline, related posts. Use when the brief asks for "blog", "article", "post", "essay", or "case study".

โ†‘ GrowingActive Claude Code
97k GitHub stars Apache-2.0 Updated Sep 21, 2026 Free

Structured medical case presentation for clinical rounds, conferences, and documentation. Generates SOAP-format or narrative case reports with physiologically accurate vitals, labs, and evidence-based plans. Use when the brief mentions "case report", "case presentation", "SOAP note", "clinical case", "ward rounds", "case summary", or "patient presentation".

โ†‘ GrowingActive Claude Code
97k GitHub stars Apache-2.0 Updated Sep 21, 2026 Free

A consumer-feeling dating / matchmaking dashboard โ€” left rail navigation, ticker bar of community signals, headline KPIs, a 30-day mutual-matches bar chart, and a match-rate trend block. Editorial typography, restrained accent. Use when the brief asks for a "dating site", "matchmaking", "community dashboard", "social network dashboard", or any consumer product where the data is the story.

โ†‘ GrowingActive Claude Code
97k GitHub stars Apache-2.0 Updated Sep 21, 2026 Free

A brand product-launch email โ€” masthead with wordmark, hero image block, headline lockup with skewed-italic accent, body copy, primary CTA, and a specifications grid. Pure HTML email layout (centered single column, table fallback). Use when the brief asks for an "email", "newsletter blast", "MJML", "product launch email", or "email template".

โ†‘ GrowingActive Claude Code
97k GitHub stars Apache-2.0 Updated Sep 21, 2026 Free