Skip to content
AuraUIGitHub

Build better UI
with AuraUI

Executable Design MD systems and a curated Design Skill directory. Pick a coherent visual direction, hand it to your agent, and build interfaces with a consistent point of view.

Get started

Two product lines

One gives your agent a direction.
The other gives it taste.

AuraUI splits the problem in two: a Design MD defines the visual system, a Design Skill defines the working method. Use either alone, or combine them for your workflow.

Executable design systems

Each Design MD captures semantic colors, type scales, spacing, radius and component rules in one file your agent can read and follow. Browse captured product systems and original reference editions.

Browse Design MD

Skills that shape how it works

A directory of 39 curated Agent Skills covering interface craft, brand and visual systems, design-system management and prototyping workflows — each with its original source and editorial guidance.

Browse Design Skills
Frontend Designanthropics/skillsUI UX Pro Maxnextlevelbuilder/ui-ux-pro-max-skillTaste SkillLeonxlnx/taste-skillFrontend UI Engineeringaddyosmani/agent-skillsFrontend Design Principlesjoshuadavidthomas/agent-skillsRedesign Existing Projectsleonxlnx · AI UX Playground

Works where you already work

Use the same Markdown context with the agent or editor you choose. Keep the visual system in your project, and give each task a clear brief.

ChatGPT

Bring a Design MD into your interface brief as a concrete visual reference.

Claude

Use a Design MD as project context to keep visual decisions consistent across a build.

Cursor

Reference colors, typography, radius and spacing while building components.

Codex

Keep the Markdown in your workspace and reference it alongside your implementation task.

Gemini

Give your agent an explicit visual system and review the resulting interface against it.

Windsurf

Pair reusable visual direction with the design method your project needs.

  • Claude Code
  • Codex CLI
  • Cursor
  • Windsurf
  • Cline
  • Continue
  • Zed
  • GitHub Copilot
  • Gemini CLI
  • Aider
  • Roo Code
  • OpenHands

From direction to interface

Three steps to put the catalog to work in your next build.

  1. Browse the live previews and choose a Design MD that fits the interface you want to build.

    01 / EXPLORE

    Select a direction

  2. Download the Markdown, add it to your project and reference it in your agent’s task.

    02 / CONTEXT

    Give it context

  3. Find a Design Skill, inspect the original source and follow its installation or invocation instructions.

    03 / BUILD

    Choose a method

FAQ

What is a Design MD?

A Design MD is a Markdown file that gives an AI agent explicit visual direction, including principles, color, typography, spacing and component patterns.

What is a Design Skill?

A Design Skill is an agent-readable working method. AuraUI curates the directory and links to the original author’s instructions, repository and license.

Do I need an MCP server?

No. Download a Design MD and add it to your project context. The public AuraUI website does not require an MCP connection.

Which AI coding tools can use these files?

Use the Markdown wherever your agent or editor can read project context. Follow the original source instructions for each Design Skill and check compatibility in your own environment.

Do I need an account?

No. Browsing previews, downloading Design MD files, exploring Design Skills and reading the Blog are public.

Does AuraUI install Design Skills?

No. Installation and updates remain with each skill’s original repository. AuraUI provides an editorial index and guidance.