logobeta
Docs Components Blocks Charts soon Themes soon Colors
github icon

Sections

  • Get Started
  • Components
  • Registry soon
  • MCP Server soon
  • Roadmap
  • Changelog

Get Started

  • Installation
  • components.json
  • Theming
  • Dark Mode
  • CLI
  • Blocks
  • Pre processors
  • Figma
  • llms.txt
  • About & Credits

Components

  • Accordion
  • Alert
  • Alert Dialog
  • Avatar
  • Badge
  • Breadcrumb
  • Button
  • Button Group
  • Calendar
  • Card
  • Carousel
  • Chart soon
  • Checkbox
  • Combobox
  • Command
  • Date Picker
  • Dialog
  • Divider
  • Dropdown
  • Empty
  • Form
  • Icon
  • Input
  • Input Group
  • Kbd
  • Layout
  • Loader
  • Menu
  • Pagination
  • Popover
  • Progress Bar
  • Radio
  • Resizable
  • Segmented
  • Select
  • Sheet
  • Skeleton
  • Slider
  • Switch
  • Table
  • Tabs
  • Toast
  • Toggle
  • Toggle Group
  • Tooltip

Installation

PreviousNext

How to install dependencies and structure your app.

Pick Your Environment

Start by selecting your environment of choice. Then, follow the instructions to install the dependencies and structure your app. zard/ui is designed to work seamlessly with Angular projects.

angularlogo

angular

nxlogo

nx

Coming Soon
analog.jslogo

analog.js

Coming Soon
  • On this page

  • Overview
  • Environments
ZardUI Logo

ZardUI

The @shadcn/ui alternative for Angular. Beautiful, accessible, and customizable components.

github iconwhatsapp icondiscord iconX icon

Resources

  • GitHub Repository
  • NPM Package
  • Discord Community
  • WhatsApp Group
  • Follow us on X

Documentation

  • Get Started
  • Components
  • Roadmap
  • Changelog

Components

  • Installation
  • components.json
  • Theming
  • Dark Mode
  • CLI
  • Blocks
  • Pre processors
  • Figma
  • See all components →
❤️Made with love from🇧🇷
•

Open source and available on GitHub

© 2025 ZardUI