awesome-design-skills
A registry of design system skill files for AI coding tools such as Claude Code, covering styles from editorial print to data-dense enterprise interfaces. Each skill can be added to a project on its own.
67 skills3.4k
@bergsideDesign
Plugin
typeui
Gives your AI assistant design skills, UI prompts and brand kits so the interfaces it builds for websites and apps look more deliberate. It also brings in universal guidance on visual hierarchy, typography and accessibility for design decisions.
Plugin Signal66/100Solid
maintained90
capable29
documented75
adopted71
Claude Code
> /plugin marketplace add bergside/typeui> /plugin install typeui@bergside
Codex
$ npx skills add bergside/typeui -a codex
Cursor
$ npx skills add bergside/typeui -a cursor
Gemini CLI
$ npx skills add bergside/typeui -a gemini-cli
GitHub Copilot
$ copilot plugin marketplace add bergside/typeui$ copilot plugin install typeui@bergside
OpenCode
$ npx skills add bergside/typeui -a opencode
Windsurf
$ npx skills add bergside/typeui -a windsurf
Stats
2,233
Stars
154
Forks
Active
Maintenance
TypeScript
Language
Last commit
Created
What's inside
2 Skills
/typeuiUse TypeUI with Grok to access project design skills, brand kits, UI prompts, and layout variations through the TypeUI MCP server when creating or refining user interfaces./fundamentalsUniversal UI/UX design principles covering visual hierarchy, interaction laws, typography foundations, and WCAG accessibility requirements. Use when making design decisions not covered by a specific design system, validating principle compliance, or resolving conflicts between
1 MCP server
Links
README
TypeUI - Build better UI with AI
TypeUI is an AI-first platform where you can use design skills, UI prompts, and other resources to enhance AI capabilities to generate better user interfaces and design when building websites and applications. The resources from this repository will work with any AI provider, given they support markdown files or general prompting.
Getting started
Install TypeUI where you build. Connect your AI coding tool to TypeUI MCP, then ask for UI in plain language while TypeUI supplies design systems, prompts, and layout variation guidance.
Codex
Connect Codex to TypeUI MCP automatically with the TypeUI Codex plugin.
Install in Codex →
Claude
Give Claude access to curated design guidance while it writes or refactors UI.
Install in Claude →
Cursor
Use the TypeUI Cursor plugin while Cursor builds screens, sections, and variations.
Install in Cursor →
Grok
Add the hosted TypeUI MCP server to Grok.
Open Grok guide →
Z.ai
Add the hosted TypeUI MCP server to Z.ai ZCode.
Open Z.ai guide →
Hermes
Install the TypeUI MCP plugin for Hermes Agent.
Open Hermes guide →
OpenClaw
Add the hosted TypeUI MCP server to OpenClaw.
Open OpenClaw guide →
Eve
Add TypeUI design skills to Eve agents.
Open Eve guide →
Mistral
Add the hosted TypeUI MCP server to Mistral.
Open Mistral guide →
OpenCode
Give OpenCode access to TypeUI design systems and prompts.
Install in OpenCode →
VS Code
Connect GitHub Copilot in VS Code to TypeUI MCP.
Install in VS Code →
Antigravity
Connect Antigravity to TypeUI MCP for UI generation workflows.
Open Antigravity guide →
Windsurf
Connect Windsurf Cascade to TypeUI MCP.
Install in Windsurf →
JetBrains
Connect JetBrains AI Assistant or Junie to TypeUI MCP.
Install in JetBrains →
Zed
Add the hosted TypeUI MCP server to Zed.
Open Zed guide →
GitHub Copilot
Add the hosted TypeUI MCP server to GitHub Copilot.
Open GitHub Copilot guide →
Cline
Add the hosted TypeUI MCP server to Cline.
Install in Cline →
Qwen
Add the hosted TypeUI MCP server to Qwen Code.
Open Qwen guide →
Amp
Add the hosted TypeUI MCP server to Amp.
Open Amp guide →
Goose
Add the hosted TypeUI MCP server to Goose.
Open Goose guide →
Lovable
Add the hosted TypeUI MCP server to Lovable.
Open Lovable guide →
Replit
Add the hosted TypeUI MCP server to Replit.
Open Replit guide →
v0
Add the hosted TypeUI MCP server to v0.
Open v0 guide →
Design skills
Check out all design skills. Available in both DESIGN.md and SKILL.md formats.
Agentic
Ant
Application
Stars on GitHub
Momentum
- stars in total
- 2.2k
File tree
More plugins by @bergside.
View @bergside’s profile@bergsidebergside-awesome-desig…
Gives your AI coding assistant ready-made design guidance, covering typography, color, spacing, components and accessibility rules, so the interfaces it builds follow a consistent visual style. Each style comes with a short instruction file and a companion design note.
67 skills3.4k
@bergsideSimilar plugins.
ui-ux-pro-max
A design toolkit for Claude Code covering UI styling, design tokens and component specs, brand identity and voice, banners, logos, and HTML slide presentations with charts.
7 skills1 agent2 commands3 MCP+3+2+2+2+1+1+1+1143k
@nextlevelbuilderimpeccable
Design guidance for AI coding agents that helps shape, critique, polish, and improve frontend interfaces such as websites, landing pages, and dashboards. It includes live browser iteration and rules that catch common issues in AI-generated frontend design.
1 skill4 agents107k
@pbakausopen-design
Turns a brief into a design prototype, website, app, deck, or video that follows your design system, then lets your team share it and refine it with an AI agent in the same project.
170 skills1 command1 MCP+2+1+1+1107k
@nexu-iodiagram-design
Creates branded editorial diagrams such as architecture charts, flowcharts, sequence diagrams, ER models, timelines and swimlanes as self-contained HTML and SVG files. Suited to writers and designers who want polished visuals for Claude Code.
1 skill7 commands+166k
@cathrynlaveryQuestions about typeui.
Install it with the command on its page. It includes typeui, fundamentals. Its skills do not fire on their own yet. Free and open source.
- What is typeui?
- bergside/typeui is a plugin that ships skills and MCP servers for generating user interfaces. It adds design skills, UI prompts and brand kits, including the typeui skill for project design work and the fundamentals skill for UI/UX principles and accessibility, for use when building websites and applications.
- How do I install typeui?
- Run these in Claude Code: /plugin marketplace add bergside/typeui then /plugin install typeui@bergside. Then prompt normally.
- Does typeui auto-invoke its skills?
- Not yet. It is indexed on Flowy as a plain plugin.
- Is typeui free?
- Yes. Flowy is free and open source, with nothing gated. You can read every skill in full before you install.
- Which coding agents can use typeui's skills?
- typeui installs in Claude Code, and its skills also install in Codex, Cursor, Gemini CLI, GitHub Copilot, OpenCode and Windsurf with the skills CLI. Each skill's page has the install command. Flowy's auto-invocation, which fires a skill when your prompt matches, runs in Claude Code only.
Is this plugin yours?
Claim it with GitHubSubmit a pluginPromote it