Design tools and coding agents usually live apart. OpenDesign puts them in one project. You write a brief, an agent such as Claude Code, Codex or DeepSeek Harness builds the result, and you see it in a live preview beside the conversation. Teammates can then give feedback in the same project.

It connects to agents in two ways. Agents that consume OpenDesign use its skills, CLI and MCP setup, for example `od mcp install claude`. Others are launched directly through native runtime adapters. With no agent CLI installed, a bring-your-own-key proxy takes a base URL, API key and model for OpenAI, Anthropic, Azure, Google Gemini, Ollama, LM Studio, vLLM or any OpenAI-compatible endpoint.

Output follows a DESIGN.md design system plus skills, templates and plugins you can inspect and change. The project is Apache 2.0 licensed, and a paid hosted option, OpenDesign Cloud, also exists. The README text provided is cut off, so details past the demo section are unclear.

Read more on interesting repos · GitHub

A framework and compact language for letting LLMs stream live UI components

Most AI apps return text. OpenUI is for apps where the model should return interface: a table, a form, a chart, a dashboard. You list the components the model may use, and OpenUI turns that list into a system prompt.

The model answers in OpenUI Lang, a compact format built to be read while it streams. A renderer parses tokens as they arrive and draws the UI step by step. Output is limited to the components you register, and component props are typed with Zod schemas.

The README compares it with JSON-based formats such as Vercel's json-render and Thesys C1 JSON, and reports about 52% fewer tokens in its own benchmarks across seven scenarios. It also lists Google's A2UI and CopilotKit's OpenGenUI as alternatives. The core is framework-agnostic, with runtimes for React, Vue, Svelte and Angular.

Read more on interesting repos · GitHub

Ask an AI coding assistant for a diagram and you often get a generic rounded-box picture that clashes with your site. This skill gives the assistant a set of diagram layouts with a restrained editorial style: no shadows, little decoration, and an accent color kept for the one or two things the reader should see first.

Each diagram type comes in three static variants: minimal light, minimal dark, and full editorial. The output is plain HTML with inline SVG, so you can open it in a browser with no build step, JavaScript or external images. The README says it can read your website to match your brand. It can also redraw existing draw.io, Mermaid or Excalidraw sources at a chosen size and level of detail.

The README lists dozens of layouts, from architecture, flowchart, sequence and ER diagrams to Sankey, Wardley map, kanban, UML class and database schema. Semantic patterns, such as a queue or a trust boundary, describe behavior separately from layout, so they reuse the nearest existing type. Motion is optional; static output is the default.

Read more on interesting repos · GitHub

Pascal lets you model buildings in 3D: sites, buildings, levels, walls, slabs, ceilings, roofs, zones, and items such as doors, windows and lights. You can use it in the browser, or install a CLI that starts the editor and keeps projects in a local database on your computer.

Under the hood, the scene is a flat dictionary of typed nodes held in a Zustand store, with undo and redo. React components render each node type as Three.js objects, and separate systems update the geometry. The code is split into npm packages (core, viewer, editor, nodes, cli, mcp), so you can embed the viewer in your own React app.

The agent side is what sets it apart. A local MCP server exposes scene tools, resources and prompts to MCP-compatible AI hosts, and the repo ships agent skills and plugins for Claude Code and Codex. The README also shows a hosted 'Pascal Next' demo, but says that experience is not yet part of the open-source release.

Read more on interesting repos · GitHub

AI coding agents often produce interfaces that look generic or inconsistent. This repo gives them a written design system to follow, so the output matches a chosen style instead of the agent's defaults.

Each of the 67 entries is a folder with two files. SKILL.md holds instructions for the agent: design tokens, component rules, accessibility constraints and quality checks. DESIGN.md explains the intent and reasoning for people. You run `npx typeui.sh pull <name>` to copy a style into your project.

The styles range from named looks such as brutalism, glassmorphism, claymorphism and bento to broader moods such as corporate, playful or editorial. The README also shows a preview image for each one, and a gallery on the TypeUI site lets you browse them. The README shown here is cut off partway through the list, so I can't describe the later entries.

Read more on interesting repos · GitHub

Coding agents often invent colors, fonts, and spacing when they build a UI. DESIGN.md gives them one file that describes the visual identity, so the output stays consistent from one session to the next.

The file has two layers. YAML front matter holds exact token values: colors, typography, rounded corners, spacing, and component styles. The markdown body explains the reasoning, such as why one accent color drives all interaction. Tokens can point to each other with references like {colors.primary}.

The project also ships a CLI, @google/design.md. It checks a file for broken references and low WCAG contrast, compares two versions to catch regressions, and exports tokens to Tailwind v3, Tailwind v4 CSS, or the W3C Design Tokens format. The format is at version alpha, so expect changes.

Read more on interesting repos · GitHub

A DESIGN.md is a plain markdown file that describes how a product should look and feel. The README compares it to AGENTS.md: AGENTS.md tells coding agents how to build the project, and DESIGN.md tells design agents how it should look. The idea comes from Google Stitch.

This repo is a curated index. Each entry links to a DESIGN.md on getdesign.md that was extracted from a real site, with notes on its patterns, tokens and rules. The README lists about 70 brands, grouped by area: AI platforms, developer tools, fintech, retail, media, automotive, and a few retro 1990s and early-2000s pages.

You copy a file into your project root and ask your agent to build a page that looks like it. There is no Figma export, JSON schema or extra tooling, only text the model reads directly. The README also links a form to request new sites, including private requests. It carries sponsor and product promotions, which are separate from the collection.

Read more on interesting repos · GitHub