zard-uiOfficial·11 Agent Skills Included

zardui

Build beautiful Angular interfaces with ready-made Tailwind components

Installs and composes zard/ui components, an open-source Angular library styled with TailwindCSS, directly into your project as editable source code. Eliminates hand-built buttons, forms, dialogs, and tables by giving your AI agent the real component APIs, theme tokens, and styling rules. Speeds up Angular UI work with CLI commands, an MCP server, and clear conventions for variants, icons, and forms.

1,138|95

↗

npx skills add zard-ui/zardui --all -g -y

All Skills in This Repository (11)

Pure Emerald Level Indicators

📦 In Repo

zard-ui

angular-testing

Test Angular v21+ apps with Vitest or Jasmine.

angular-ssr

Enable server-side rendering and hydration for Angular v20+ projects.

angular-di

Configure Angular dependency injection with inject(), tokens, and providers.

angular-routing

Configure Angular v20+ routing with lazy loading, guards, and resolvers.

angular-forms

Create type-safe reactive Angular forms with the Signal Forms API.

angular-http

Fetch API data in Angular using signal-based httpResource patterns.

angular-component

Create standalone Angular v20+ components with signal-based inputs and outputs.

angular-tooling

Centralize Angular CLI tooling for v20+ project setup, generation, builds, and tests.

angular-directives

Create reusable Angular directives for DOM behavior management.

angular-signals

Create Angular signals for state, derived state, and side effects.

zard

Installs, composes, and styles zard/ui Angular components via the zard-cli and registry.

Official

Advanced

Frequently Asked Questions

FAQPage Schema

How to install zardui?▼

Run `npx skills add zard-ui/zardui --all -g -y` in your terminal to install all skills in this suite globally.

What is zard/ui?▼

It is a free, open-source Angular component library inspired by shadcn/ui and styled with TailwindCSS. Components are copied into your project as source code you fully own and can edit.

How do I add zard/ui components to an Angular project?▼

Run `npx zard-cli init` to set up your project, then `npx zard-cli add button card` to install the components you need. Your AI agent can also do this automatically through the included skill.

Does zard/ui work with AI coding assistants?▼

Yes. It ships a SKILL.md and an MCP server that give agents like Claude Code, Cursor, and Codex the real component source and documentation instead of guessed APIs.

Can I customize zard/ui component themes?▼

Yes. Themes are plain CSS variables in your global stylesheet, so changing one token updates every component at once. You can also add variants or wrap components for repeated patterns.