ng-zorro-antd
An enterprise-focused Angular UI component library implementing the Ant Design system, providing 70+ TypeScript components with theming, i18n, SSR, and zoneless/OnPush support.
MITPermissive — free to use in commercial and proprietary software, with attribution.View license →
Production readiness
5/5- Actively maintainedCommits in the last 6 months
- No known vulnerabilitiesNo OSV advisories
- Clear, usable licenseMIT (permissive)
- Proven adoptionWidely used
- Has documentationDocumentation indexed
npm install ng-zorro-antdOur analysis
NG-ZORRO is the official Angular implementation of Ant Design, offering a comprehensive set of enterprise-grade UI components written in TypeScript. It brings Ant Design's visual language and interaction patterns to the Angular ecosystem.
When to use ng-zorro-antd
Choose it for Angular applications—particularly internal tools, dashboards, and enterprise admin systems—where you want a polished, consistent design system out of the box with strong theming and internationalization. It's a natural fit for teams already familiar with Ant Design or migrating between React/Angular stacks that want visual parity.
When not to
Avoid if you're not on Angular (it's Angular-only), if you want a Material Design look (use Angular Material), or if you need a minimal headless/unstyled component approach. Its opinionated Ant Design aesthetic is hard to fully reskin into a distinctly different brand.
Strengths
- Large, mature catalog of 70+ components covering most enterprise UI needs
- Tight design parity with Ant Design, kept in sync regularly
- Modern Angular support including zoneless/OnPush, SSR, and ng add CLI integration
- Strong internationalization with dozens of locales
- Backed by real enterprise adoption (Alibaba, Apache projects)
Trade-offs
- Strongly tied to the Ant Design visual style, limiting deep custom branding
- Angular-only, so no reuse across other frameworks
- Tracks the latest Angular versions aggressively (e.g. Angular ^21), which can force upgrade pressure
- Component-module imports add some boilerplate compared to standalone-first libraries
- Bundle size considerations with a large component surface
Maturity
Mature and actively maintained with ~9k stars, regular releases aligned with Angular versions, broad enterprise usage, and an established community on Discord and Stack Overflow.
An enterprise-class Angular UI component library based on Ant Design.
English | 简体中文
✨ Features
An enterprise-class UI design system for Angular applications.
70+ high-quality Angular components out of the box.
Written in TypeScript with predictable static types.
The whole package of development and design resources and tools.
Support Zoneless and OnPush mode, high performance.
Powerful theme customization in every detail.
Internationalization support for dozens of languages.
☀️ License
🖥 Environment Support
Server-side Rendering
Modern browsers including the following specific versions
EdgeFirefoxChromeSafariOperaElectronlast 2 versionslast 2 versionslast 2 versionslast 2 versionslast 2 versionslast 2 versions
🎨 Design Specification
ng-zorro-antd synchronizes design specification with Ant Design on a regular basis, you can check the log online.
📦 Installation
We recommend using @angular/cli to install. It not only makes development easier, but also allows you to take advantage of the rich ecosystem of angular packages and tooling.
$ ng new PROJECT_NAME
$ cd PROJECT_NAME
$ ng add ng-zorro-antd
More information about
@angular/clihere.
You can also install ng-zorro-antd with npm or yarn
$ npm install ng-zorro-antd
🔨 Usage
Import the component modules you want to use into your component.
import { NzButtonModule } from 'ng-zorro-antd/button';
@Component({
imports: [NzButtonModule]
})
export class AppComponent {}
@angular/cliusers won't have to worry about the things below but it's good to know.
And import style and SVG icon assets file link in angular.json.
{
"assets": [
+ {
+ "glob": "**/*",
+ "input": "./node_modules/@ant-design/icons-angular/src/inline-svg/",
+ "output": "/assets/"
+ }
],
"styles": [
+ "node_modules/ng-zorro-antd/ng-zorro-antd.min.css"
]
}
See Getting Started for more details.
🔗 Links
⌨️ Development
$ git clone git@github.com:NG-ZORRO/ng-zorro-antd.git
$ cd ng-zorro-antd
$ npm install
$ npm run start
Browser would open automatically.
🤝 Contributing
We welcome all contributions. Please read our CONTRIBUTING.md first. You can submit any ideas as pull requests or as GitHub issues.
If you're new to posting issues, we ask that you read How To Ask Questions The Smart Way (This guide does not provide actual support services for this project!), How to Ask a Question in Open Source Community and How to Report Bugs Effectively prior to posting. Well written bug reports help us help you!
Thanks to JetBrains for supporting us free open source licenses.
❓ Help from the Community
For questions on how to use ng-zorro-antd, please post questions to using the ng-zorro-antd tag. If you're not finding what you need on stackoverflow, you can find us on
As always, we encourage experienced users to help those who are not familiar with ng-zorro-antd!
🎉 Users
We list some users here, if your company or product uses NG-ZORRO, let us know here!
Love ng-zorro-antd? Give our repo a star :star: :arrow_up:.
