Prima il modulo
Surface · pubblico · tono · brand · scala. Trenta secondi di radio battono trenta minuti di rifacimenti.
Open source · Local-first · BYOK
Open Design
L'alternativa open source a Claude Design.
Mosso dal coding-agent CLI che hai già — Claude Code, Codex, Cursor, Gemini, OpenCode, più altri undici. 110 Skills · 141 Design Systems · 5 direzioni visive · Apache-2.0.
Apache-2.0 · senza registrazione · il tuo CLI, le tue chiavi
Open Design · demo live
Sfoglia tutti gli 110 skills Perché esiste
Claude Design è diventato virale. Ed è rimasto chiuso.
Claude Design di Anthropic (Opus 4.7, aprile 2026) ha mostrato cosa succede quando un LLM smette di scrivere prosa e inizia a consegnare artifact di design. È diventato virale — ed è rimasto chiuso, a pagamento, solo cloud, incatenato al modello di Anthropic e ai suoi skill. Open Design è l'alternativa open source. Stesso loop. Stesso modello mentale «artifact prima di tutto». Senza il lock-in.
Chiuso → aperto
Apache-2.0, da cima a fondo.
Ogni skill è un file. Ogni design system è un file Markdown. Ogni prompt è un modulo TypeScript che puoi leggere e modificare.
Agente fornito → il tuo
Usa il CLI che hai già.
16 CLI di coding-agent rilevati automaticamente nel tuo PATH. Niente installato? Incolla qualunque baseUrl + apiKey compatibile con OpenAI.
Cloud → locale
Gira sul tuo laptop. Si deploya su Vercel.
pnpm tools-dev e parte in locale. SQLite in .od/. Deploy Vercel opzionale. I tuoi dati, il tuo filesystem, decidi tu.
Come un prompt diventa un artifact
Quattro passi. Niente improvvisazione.
OD non lascia al modello un solo pixel libero. Ogni brief è bloccato prima che parta la pittura.
Selettore di direzione
Niente brand spec? Scegli fra 5 direzioni visive curate — ognuna con palette OKLch deterministica e font stack.
TodoWrite in streaming
Il piano dell'agente arriva come card live. in_progress → completed si aggiorna in tempo reale. Cambiare rotta a metà volo costa poco.
<artifact> renderizza
Anteprima in iframe sandbox. Editabile sul posto. Scaricabile come HTML, PDF, PPTX o ZIP.
Cosa c'è nella scatola
110 Skills × 141 Design Systems.
Ogni Skill è una cartella. Ogni Design System è un file Markdown a 9 sezioni. Trascini una cartella, riavvii il daemon e compare nel picker. Cambi sistema, il render successivo usa i nuovi token.
Skill spotlight · html-ppt
Un solo skill. 36 temi, 31 layout, 47 animazioni, 14 template di deck.
Lo skill html-ppt incluso porta ogni primitiva di cui un agente di deck ha bisogno: modalità presentatore, libreria di layout, set di animazioni cinetiche e 14 template pronti da forkare. Trascini la cartella, riavvii il daemon, hai un engine PPT nel browser.
Varianti «taste-locked»
Stesso engine, tre taste.
html-ppt-taste-brutalist e html-ppt-taste-editorial sono spediti come wrapper «taste-locked» autonomi — stesso skill, estetica hardcoded. Più altri tre per i prototipi web: web-prototype-taste-{brutalist,editorial,soft}.
Bring your own agent
16 CLI rilevati in automatico nel tuo PATH.
Quelli che hai installati diventano candidati come engine di design. Cambia con un click dal picker del modello.
claude
Claude Code
stream-json
codex
Codex CLI
json-event-stream
cursor-agent
Cursor Agent
json-event-stream
gemini
Gemini CLI
json-event-stream
opencode
OpenCode
json-event-stream
qwen
Qwen Code
plain
qoder
Qoder CLI
json-event-stream
copilot
GitHub Copilot CLI
stream-json
devin
Devin Terminal
ACP
hermes
Hermes
ACP
kimi
Kimi CLI
ACP
kiro-cli
Kiro CLI
ACP
kilo
Kilo
ACP
vibe-acp
Mistral Vibe
ACP
deepseek
DeepSeek TUI
stream-json
pi
Pi
stdio JSON-RPC
Niente CLI installato? POST /api/proxy/stream accetta qualunque baseUrl + apiKey + model compatibile con OpenAI, Azure o Google. Shim Anthropic-via-OpenAI, DeepSeek, Groq, OpenRouter, Azure OpenAI, Google Vertex, il tuo vLLM auto-ospitato — tutti nello stesso loop. Protetto da SSRF al bordo del daemon, contro destinazioni loopback, link-local e RFC1918.
Sette idee portanti
In cosa crediamo, in sette righe.
01
Non ti diamo un agente. Il tuo basta.
+
01
Non ti diamo un agente. Il tuo basta.
Il daemon scansiona il tuo PATH per 16 CLI di coding-agent noti. Quelli che trova diventano candidati come engine di design, pilotati su stdio con un adattatore per CLI.
02
Gli Skills sono file, non plugin.
+
02
Gli Skills sono file, non plugin.
Ogni skill è SKILL.md + assets/ + references/. Trascini una cartella in skills/, riavvii il daemon, compare nel picker. Il bundle magazine-web-ppt è committato pari pari, licenza preservata.
03
I Design Systems sono Markdown portatile, non JSON di tema.
+
03
I Design Systems sono Markdown portatile, non JSON di tema.
Lo schema DESIGN.md a 9 sezioni — colore, tipografia, spacing, layout, componenti, motion, voice, brand, anti-pattern. Ogni artifact legge dal sistema attivo. Cambi sistema → il render successivo usa i nuovi token.
04
Il modulo interattivo evita l'80 % dei rifacimenti.
+
04
Il modulo interattivo evita l'80 % dei rifacimenti.
Il turno 1 è solo un <question-form>: niente pensiero, niente strumenti, niente narrativa. Surface · pubblico · tono · brand · scala. Il costo di sbagliare direzione è un round di chat, non un deck finito.
05
Il daemon fa sentire l'agente come se fosse sul tuo laptop.
+
05
Il daemon fa sentire l'agente come se fosse sul tuo laptop.
Il daemon lancia il CLI con cwd sulla cartella degli artifact del tuo progetto. L'agente riceve Read, Write, Bash, WebFetch — strumenti veri su un filesystem vero. SQLite persiste progetti, conversazioni, messaggi e tab.
06
Il prompt stack è il prodotto.
+
06
Il prompt stack è il prodotto.
Discovery directives + identity charter + DESIGN.md attivo + SKILL.md attivo + metadati di progetto + side-file dello skill. Ogni layer è composable. Ogni layer è un file che puoi modificare.
07
Open Design non è un silo. Gli altri tuoi agent lo leggono.
+
07
Open Design non è un silo. Gli altri tuoi agent lo leggono.
`od mcp` espone il progetto come server MCP via stdio. Claude Code, Codex, Cursor, VS Code, Antigravity, Zed, Windsurf — qualunque cosa parli MCP — legge i tuoi artifact, file e metadati direttamente. Read-only al bordo: lettura file, search, metadati. Niente superficie di scrittura, niente chiamate esterne.
Il prompt stack
DISCOVERY directives (turn-1 form, turn-2 brand branch, TodoWrite, 5-dim critique)
+ identity charter (OFFICIAL_DESIGNER_PROMPT, anti-AI-slop, junior-pass)
+ active DESIGN.md (141 systems available)
+ active SKILL.md (110 skills available)
+ project metadata (kind, fidelity, speakerNotes, animations, inspiration ids)
+ skill side files (auto-injected pre-flight: read assets/template.html + references/*.md)
+ (deck kind, no skill seed) DECK_FRAMEWORK_DIRECTIVE (nav / counter / scroll / print)
Ogni layer è composable. Ogni layer è un file che puoi modificare.
Confronto
Open Design contro il resto.
Prodotto cloud chiuso, peer desktop aperto, web app aperta. Prendiamo in prestito generosamente da open-codesign e lo accreditiamo su /about — formato diverso, prompt-stack diverso, stessa stella polare.
| Claude Design | Open CoDesign | Open Design | |
|---|---|---|---|
| Licenza e costo | |||
| Licenza | chiusa | MIT | Apache-2.0 |
| Fatturazione minima | Pro / Max / Team | BYOK | BYOK — qualunque URL compatibile OpenAI |
| Formato | |||
| Formato | Web (claude.ai) | Desktop (Electron) | Web app + daemon locale |
| Deployabile su Vercel | — | — | sì |
| Runtime IA e flusso | |||
| Runtime dell'agente | incluso (Opus 4.7) | incluso (pi-ai) | il tuo CLI esistente |
| Flessibilità di provider | solo Anthropic | 7+ via pi-ai | 16 CLI + proxy BYOK |
| Modulo (turno 1) | — | — | regola dura |
| 5 direzioni visive | — | — | sì |
| Autocritica a 5 dimensioni | — | — | porta prima dell'emit |
| Skills, sistemi e migrazione | |||
| Skills | proprietari | 12 moduli TS | 110 bundle SKILL.md droppabili |
| Design systems | proprietari | DESIGN.md (v0.2) | 141 sistemi inclusi |
| Import ZIP Claude Design | n/d | — | sì — continua da dove Anthropic ti ha lasciato |
Claude Design è marchio registrato di Anthropic. Open Design non è affiliato né sostenuto da Anthropic.
Oltre la chat
Immagine, video, audio — la stessa superficie.
La chat che produce HTML <artifact> guida anche la generazione di immagine, video e audio. Ogni render atterra come un .png o .mp4 vero nel workspace del tuo progetto. 95 prompt pronti da riprodurre sotto prompt-templates/.
01
gpt-image-2
Poster · avatar · mappe illustrate · infografiche · card social in stile rivista · UI di gioco · still narrativi di gioco
ingrandisci gpt-image-2
Evoluzione di scalinata in pietra 3D
ingrandisci gpt-image-2
Mappa gastronomica illustrata della città
ingrandisci gpt-image-2
Scena d'ascensore cinematografica
ingrandisci gpt-image-2
Ritratto anime cyberpunk
ingrandisci gpt-image-2
Ritratto da studio glamour
ingrandisci gpt-image-2
Anime Fighting Game — Captain Ryuuga vs Kaze Renshin
ingrandisci gpt-image-2
Three Kingdoms — Guanyu uccide Yanliang
ingrandisci gpt-image-2
Three Kingdoms — Lyubu al tiro con l'arco di Yuanmen
ingrandisci gpt-image-2
Three Kingdoms — Zhaoyun fugge con la culla
ingrandisci gpt-image-2
HUD MMO open-world Cina antica
ingrandisci gpt-image-2
Disegno bambino a pastelli → reinterpretazione fotorealistica
ingrandisci gpt-image-2
Scomposizione coreografia otaku — 16 pannelli
ingrandisci gpt-image-2
Storyboard ballo sensazionale — 8 inquadrature
02
Seedance 2.0
15s di t2v + i2v cinematografico con audio · short narrativi · film di prodotto
Seedance 2.0
Music Podcast & chitarra
Seedance 2.0
Primo piano emotivo
Seedance 2.0
Supercar di lusso cinematografica
Seedance 2.0
Satira del gatto della Città Proibita
Seedance 2.0
Short romance giapponese
Seedance 2.0
Volo cinematografico di drago
Seedance 2.0
Inseguimento in fabbrica nelle terre desolate
Seedance 2.0
Trailer di gioco cyberpunk
Seedance 2.0
Crimson Horizon Sci-Fi
Seedance 2.0
Storyboard accademia magica
Seedance 2.0
Rissa fra vampiri nel vicolo
Seedance 2.0
Estetica wuxia retrò di HK
Seedance 2.0
Three Kingdoms — Guanyu uccide Yanliang
Seedance 2.0
Three Kingdoms — Lyubu al tiro con l'arco di Yuanmen
Seedance 2.0
Three Kingdoms — Zhaoyun fugge con la culla
Seedance 2.0
Bambino 3D animato che costruisce con Lego
Seedance 2.0
Salvataggio dell'antico drago guardiano
Seedance 2.0
Antico regno indiano — FPV
Seedance 2.0
Motion graphics intro di personaggio
Seedance 2.0
Danza delle mani di donna est-asiatica
Seedance 2.0
Biologa marina in esplorazione
Seedance 2.0
Corsa su strada cinematografica
Seedance 2.0
Jumpscare razzo-tostapane
Seedance 2.0
Pirata Disney vintage con coccodrillo
Seedance 2.0
Fantasia haute couture hollywoodiana
03
HyperFrames
Motion graphics HTML→MP4 · reveal di prodotto · tipografia cinetica · grafici di dati
ingrandisci HyperFrames
Outro logo cinematografico
ingrandisci HyperFrames
Showcase app su tre telefoni
ingrandisci HyperFrames
Karaoke TikTok
ingrandisci HyperFrames
Bar-chart race
ingrandisci HyperFrames
Rotta su mappa di volo
ingrandisci HyperFrames
Contatore di soldi hype
ingrandisci HyperFrames
Stack di overlay social
ingrandisci HyperFrames
UI 3D-reveal
Quickstart
Tre comandi. Senza registrazione.
Node ~24, pnpm 10.33.x. Gira su macOS, Windows e Linux (build AppImage via `pnpm tools-pack linux build --to appimage`). Il daemon crea una cartella .od/ locale per SQLite e gli artifact per progetto. Niente passo di init.
git clone https://github.com/nexu-io/open-design.git
cd open-design && pnpm install
pnpm tools-dev run webCosa c'è di nuovo · v0.5.0
Quattro svolte da v0.4.0.
v0.5.0 alza il loop dell'artifact da «renderizzato e via» a «continui a limarlo» — Inspect mode per regolare lo stile elemento per elemento, i live dashboard salgono a categoria di artifact di prima fascia, la rubrica del Design Jury più affilata. L'`od mcp` di v0.4.0 sta ancora lì e continua a infilare tutto questo negli altri coding agent del tuo portatile.
Regolazione per elemento
Inspect mode — clicca qualsiasi cosa nella preview.
Hover, clic, regola il computed style dell'elemento — colore, spaziatura, dimensione del font — senza tornare dall'agent. L'artifact si aggiorna sul posto. Quando ti soddisfa, le modifiche tornano nei file sorgente.
v0.5.0 · PR #362
Categoria di prima fascia
I live dashboard salgono da demo a default.
Tre nuovi skill di dashboard (`live-dashboard`, il template `clinic-console` sotto `live-artifact`, `flowai-live-dashboard-template`) più una prompt template di team-dashboard stile Notion — tutti agganciano gli artifact a connettori Composio veri. Quello che gira nel pannello di preview sono dati vivi, non mock congelati.
v0.5.0 · PR #778 + #795 + #801 + #799
Quality gate · Fase 5
La rubrica del Design Jury passa per il system composer.
La rubrica di ogni panelista vive ora in una prompt template a livello panel, iniettata via il system composer condiviso. Da una run all'altra le valutazioni restano coerenti. Persistenza, transcript e orchestratore della Fase 4 si trascinano dietro.
v0.5.0 · PR #524
Protocollo
od mcp — Open Design come MCP server.
Lancia `od mcp` e qualunque coding-agent che parli MCP (Claude Code, Codex, Cursor, VS Code, Antigravity, Zed, Windsurf) legge direttamente i file, l'indice di ricerca e i metadati del tuo progetto. Read-only al bordo. Il progetto che l'app OD ha aperto è quello che ora vedono tutti gli altri agent.
v0.4.0 · PR #399
La discendenza di Open Design
Da cosa è composto Open Design.
alchaincyf
Bussola filosofica del design
huashu-design ↗
Workflow Junior-Designer, protocollo brand-asset in 5 passi, checklist anti-AI-slop, autocritica a 5 dimensioni e le 5 scuole × 20 filosofie di design dietro al selettore di direzione di Open Design.
op7418
Modalità deck
guizang-ppt-skill ↗
Incluso pari pari sotto skills/guizang-ppt/ con la LICENSE originale. Layout in stile rivista, hero WebGL e cultura delle checklist P0/P1/P2 sono filtrati in tutti gli altri skill di Open Design.
OpenCoworkAI
Parente più vicino · stella polare di UX
open-codesign ↗
Loop di artifact in streaming, anteprima in iframe sandbox, pannello agente live (todos + tool calls + interrompibile), export in cinque formati, annotazioni in modalità commento. Sul formato la divergenza è voluta — open-codesign spedisce Electron + pi-ai, Open Design spedisce web + daemon locale + il tuo CLI.
multica-ai
Architettura del daemon
multica ↗
Rilevamento agenti via scan del PATH, daemon locale come unico processo privilegiato, visione dell'agente come compagno di squadra. Open Design adotta il modello architetturale; il codice di multica in sé non è vendorizzato.
Mettici una stella
Se ti ha fatto risparmiare mezz'ora — metti una ★.
Le stelle non pagano l'affitto, ma dicono al prossimo designer, agente e contributor che questo esperimento merita la loro attenzione.
Apache-2.0
Open source
110
Skills
141
Design Systems
16 + BYOK
CLI
FAQ
Domande frequenti
Cos'è Open Design?
+
Open Design è l'alternativa open source a Claude Design di Anthropic. Gira in locale con pnpm tools-dev, si deploya su Vercel e usa il coding-agent CLI che hai già (Claude Code, Codex, Cursor, Gemini, OpenCode, +11 altri) come engine di design. Sotto licenza Apache-2.0.
In cosa Open Design si differenzia da Claude Design?
+
Claude Design è chiuso, a pagamento (Pro/Max/Team), solo cloud e incatenato al modello e agli skill di Anthropic. Open Design è open source, BYOK, local-first e ti lascia cambiare modello liberamente fra 16 adattatori CLI o qualunque endpoint compatibile con OpenAI / Azure / Google.
Open Design può sostituire Claude Design per il mio team?
+
Se hai bisogno di self-hosting, flessibilità di modello o skill custom, sì. Il loop completo (rilevare agente → scegliere skill + design system → chat → parse di <artifact> → preview → salvataggio) gira end-to-end. v0.4.x ha aggiunto Critique Theater (voto della Design Jury prima dell'emit), Tweaks mode (picker dell'elemento + allegati al chat), Manual edit mode e live artifact che attingono dati vivi dai connettori Composio.
Mi serve un abbonamento Claude Pro per usare Open Design?
+
No. Open Design usa il coding-agent CLI che hai già nel PATH, oppure qualunque API key compatibile con OpenAI via il proxy BYOK. Porta le tue chiavi del provider che preferisci.
Quali CLI di coding-agent supporta Open Design?
+
16 di serie: Claude Code, Codex CLI, Cursor Agent, Gemini CLI, OpenCode, Qwen Code, Qoder CLI, GitHub Copilot CLI, Devin for Terminal, Hermes, Kimi CLI, Kiro CLI, Kilo, Mistral Vibe, DeepSeek TUI e Pi. Rilevati in automatico nel PATH all'avvio del daemon.
Come importo un progetto Claude Design esistente in Open Design?
+
Trascina uno ZIP di export Claude Design sul dialog di benvenuto. POST /api/import/claude-design lo estrae in una cartella vera .od/projects/<id>/, apre il file di entry come tab e prepara un continue-prompt per il tuo agente locale.
Posso self-hostare Open Design su Vercel?
+
Sì. Il livello web è Next.js 16 + React 18 + TypeScript, deployabile su Vercel. Il daemon locale resta sul tuo laptop. La Topologia B (Vercel + tunnel) per setup completamente remoti è in roadmap.
Come aggiungo un design system custom a Open Design?
+
Trascina un file DESIGN.md in design-systems/<tuo-brand>/ seguendo lo schema a 9 sezioni (colore, tipografia, spacing, layout, componenti, motion, voice, brand, anti-pattern). Riavvia il daemon e compare nel picker.
Open Design è gratis? Qual è la licenza?
+
Apache-2.0. I bundle skills/guizang-ppt/ e skills/html-ppt/ mantengono la licenza MIT originale con attribuzione preservata. Niente piani a pagamento. Niente limiti d'uso. L'unico costo è quello che ti chiede il tuo provider LLM.
Come fa Open Design a evitare il look da AI-slop?
+
Un modulo al turno 1 blocca il brief prima che il modello dipinga. Un picker di 5 direzioni fornisce palette deterministiche se non c'è brand spec. Un'autocritica a 5 dimensioni dà un voto prima dell'emit. Ogni skill porta una checklist P0/P1/P2 imposta via injection di side-file in pre-flight. Gradienti viola aggressivi, emoji generiche e Inter come display sono esplicitamente vietati nel prompt stack.
Posso usare Open Design senza installare nessun CLI?
+
Sì. POST /api/proxy/stream inoltra chunk SSE a qualunque endpoint compatibile con OpenAI, Azure o Google. Incolla baseUrl, apiKey e model — DeepSeek, Groq, OpenRouter, MiMo, Azure OpenAI, Google Vertex, il tuo vLLM auto-ospitato, lo shim Anthropic-via-OpenAI — funzionano tutti. Protetto da SSRF su loopback e reti private.
Come valido la config del provider BYOK senza aprire una chat?
+
Settings → Execution ha un pulsante Connection test (v0.5.0, PR #507). Incolla baseUrl + apiKey + model, premi Test — Open Design spara un handshake minimo al provider e mostra o la risposta o il frame d'errore esatto. Funziona con Anthropic, OpenAI compatibile, Azure e Google. Ti risparmia il giro «apri chat, segui il guasto» quando la chiave è sbagliata, il nome del modello è scritto male o il gateway sta bloccando.
I miei dati vanno a finire in Anthropic quando uso Open Design?
+
Solo se scegli il modello di Anthropic (Claude Code o via il proxy BYOK con una chiave Anthropic). Open Design in sé tiene tutto in un SQLite locale in .od/app.sqlite e in file per progetto sotto .od/projects/. Niente viene caricato su server di Open Design — non esistono server di Open Design.
Gli altri miei coding-agent possono leggere i progetti Open Design?
+
Sì. Lancia `od mcp` e Open Design si espone come server MCP via stdio. Claude Code, Codex, Cursor, VS Code, Antigravity, Zed, Windsurf — qualunque tool che parli MCP — può leggere i file del tuo progetto, eseguire search e ispezionare i metadati. L'interfaccia è read-only al bordo: lettura file, search, metadati. Niente superficie di scrittura, niente chiamate esterne. Spedito in v0.4.0.
Cos'è Critique Theater?
+
Una Design Jury a 5 panelisti che dà un voto a ogni artifact prima che venga spedito — accessibilità, fit di brand, craft, contenuto, struttura. Persistenza + transcript + orchestratore sono end-to-end dalla Fase 4 di v0.4.0. Sotto la soglia configurata l'agente revisiona e rivota; sopra, l'artifact viene emesso.
Cosa sono i live artifact e quali connettori sono supportati?
+
I live artifact tirano dati vivi nel pannello di preview attraverso un catalogo di connettori Composio — GitHub, Linear, Notion, Gmail e altri. Gli skill inclusi orbit-general / orbit-github / orbit-gmail / orbit-linear / orbit-notion e social-media-dashboard mostrano il cablaggio end-to-end. Spedito in v0.4.0 (PR #381).
Spedire
Spedisci il tuo primo artifact in tre minuti.
Clona il repo. Lancia tre comandi. Scrivi un prompt. Guarda arrivare il modulo, compilalo, guarda streammare la card todo, guarda renderizzare l'artifact.