Menu
▾
▴
Tree [dfd64f] main / History
| File | Date | Author | Commit |
|---|---|---|---|
| skills | 2026-04-03 |
Zoltán Szőgyényi
|
[6277a4] update: remove redundant commands and component... |
| src | 2026-04-03 |
Zoltán Szőgyényi
|
[e32e52] fix: update not working when brand summary is e... |
| test | 2026-04-03 |
Zoltán Szőgyényi
|
[e32e52] fix: update not working when brand summary is e... |
| .gitignore | 2026-04-03 |
Zoltán Szőgyényi
|
[dfd64f] add: ignore lock files |
| DESIGN.md | 2026-04-03 |
Zoltán Szőgyényi
|
[6277a4] update: remove redundant commands and component... |
| LICENSE.md | 2026-03-07 |
Zoltán Szőgyényi
|
[cdbcfc] open-source <3 |
| README.md | 2026-04-03 |
Zoltán Szőgyényi
|
[6c1a27] update: readme docs for local development |
| REGISTRY.md | 2026-04-03 |
Zoltán Szőgyényi
|
[6277a4] update: remove redundant commands and component... |
| package.json | 2026-04-03 |
Zoltán Szőgyényi
|
[f15796] update: readme and package.json information |
| tsconfig.json | 2026-03-03 |
Zoltán Szőgyényi
|
[55cbdc] initial commit |
Read Me
████████╗██╗ ██╗██████╗ ███████╗██╗ ██╗██╗ ███████╗██╗ ██╗
╚══██╔══╝╚██╗ ██╔╝██╔══██╗██╔════╝██║ ██║██║ ██╔════╝██║ ██║
██║ ╚████╔╝ ██████╔╝█████╗ ██║ ██║██║ ███████╗███████║
██║ ╚██╔╝ ██╔═══╝ ██╔══╝ ██║ ██║██║ ╚════██║██╔══██║
██║ ██║ ██║ ███████╗╚██████╔╝██║██╗███████║██║ ██║
╚═╝ ╚═╝ ╚═╝ ╚══════╝ ╚═════╝ ╚═╝╚═╝╚══════╝╚═╝ ╚═╝
Design system skill generator for agentic tools (ie. Claude Code, Open Code, Codex, Cursor, etc)
typeui.sh (www.typeui.sh) is an open-source command line interface (CLI) that generates, updates, and can download skill.md files with design system specifications to instruct agentic tools and LLM's to use a certain design when building interfaces.
Getting started
You can start building with TypeUI by using the NPX command:
npx typeui.sh --help
Design systems
Check out all design systems that can be pulled into your project.
Available commands
| Command | Description |
|---|---|
generate |
Run the interactive design system prompts and generate skill files. |
update |
Update existing managed skill content in generated files. |
pull <slug> |
Pull a registry skill from bergside/awesome-design-skills and write it to selected provider paths. |
list |
Show available registry specs from bergside/awesome-design-skills (with typeui.sh preview links), then pull one automatically. |
Design Skill File Structure
Here's a breakdown of the design skill file that is being generated by the TypeUI CLI.
| Section | What it does |
|---|---|
Mission |
Defines the design-system objective and expected output quality for the agent. |
Brand |
Captures product context and brand direction to anchor decisions. |
Style Foundations |
Defines core visual tokens and constraints (visual style, typography, color palette, spacing). |
Accessibility |
States accessibility standards and non-negotiable requirements. |
Writing Tone |
Sets tone/style for generated guidance language. |
Rules: Do |
Lists required implementation practices to follow. |
Rules: Don't |
Lists anti-patterns and prohibited behaviors. |
Expected Behavior |
Sets expectations for decision-making and trade-off handling. |
Guideline Authoring Workflow |
Gives the ordered process the agent should follow when producing guidelines. |
Required Output Structure |
Enforces the final response format for consistency and completeness. |
Component Rule Expectations |
Defines required interaction/state details in component guidance. |
Quality Gates |
Adds validation criteria for clarity, testability, and consistency. |
Example Constraint Language |
Standardizes wording strength (must vs should) and constraint style. |
Local development
If you want to use this locally these are the commands you need to run:
npm install
npm run build
Then use the commands in your terminal:
node dist/cli.js --help
node dist/cli.js generate
node dist/cli.js list
node dist/cli.js pull [slug]
License
The CLI and public registry is open-source under the MIT License.
Pro version
Get access to enhanched design skill files and a private Discord community by getting the pro version and thus supporting our open-source work.
Sponsors
If you'd like to become a sponsor of the project, please check out the sponsorship page on our website.
