Back to rankings

NG-ZORRO/ng-zorro-antd

TypeScriptng.ant.design

Angular UI Component Library based on Ant Design

angularui-componentsangular-componentstypescriptant-designfrontendantdangular-directivesngxenterpriseantng-zorro
Star Growth
Stars
9.2k
Forks
4.1k
Weekly Growth
Issues
732
5k
Aug 2017Jul 2020Jul 2023Jul 2026
Artifactsnpmnpm install ng-zorro-antd
README

logo

NG-ZORRO

An enterprise-class Angular UI component library based on Ant Design.

Azure branch CodeFactor Codecov GitHub Release Date NPM package NPM downloads GitHub license Discord VSCode Extension Code style: prettier X

logo

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

GitHub license FOSSA Status

🖥 Environment Support

Edge
Edge
Firefox
Firefox
Chrome
Chrome
Safari
Safari
Opera
Opera
Electron
Electron
last 2 versions last 2 versions last 2 versions last 2 versions last 2 versions last 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/cli here.

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/cli users 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.

⌨️ 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

PRs Welcome

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.

JetBrains

❓ Help from the Community

For questions on how to use ng-zorro-antd, please post questions to Stack Overflow using the ng-zorro-antd tag. If you're not finding what you need on stackoverflow, you can find us on Discord as well.

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:.

Related repositories
justjavac/free-programming-books-zh_CN

:books: 免费的计算机编程类中文书籍,欢迎投稿

GNU General Public License v3.0pythonjavascript
weibo.com/justjavac
117.7k28.2k
angular/angular

Deliver web apps with confidence 🚀

TypeScriptnpmMIT Licenseangulartypescript
angular.dev
100.6k27.5k
storybookjs/storybook

Storybook is the industry standard workshop for building, documenting, and testing UI components in isolation

TypeScriptnpmMIT Licensestorybookstyleguide
storybook.js.org
90.6k10.2k
leonardomso/33-js-concepts

📜 33 JavaScript concepts every developer should know.

JavaScriptnpmMIT Licensejavascriptconcepts
33jsconcepts.com
66.5k9.2k
ionic-team/ionic-framework

A powerful cross-platform UI toolkit for building native-quality iOS, Android, and Progressive Web Apps with HTML, CSS, and JavaScript.

TypeScriptnpmMIT Licenseionicmobile
ionicframework.com
52.6k13.3k
prettier/prettier

Prettier is an opinionated code formatter.

JavaScriptnpmMIT Licenseformatterprinter
prettier.io
52.1k4.9k
Asabeneh/30-Days-Of-JavaScript

30 days of JavaScript programming challenge is a step-by-step guide to learn JavaScript programming language in 30 days. This challenge may take more than 100 days, please just follow your own pace. These videos may help too: https://www.youtube.com/channel/UC7PNRuno1rzYPb1xLa4yktw

JavaScriptnpm30daysofjavascriptjavascript-for-everyone
46.6k10.5k
paperless-ngx/paperless-ngx

A community-supported supercharged document management system: scan, index and archive all your documents

PythonPyPIGNU General Public License v3.0angulararchiving
docs.paperless-ngx.com
43.3k2.9k
SheetJS/sheetjs

📗 SheetJS Spreadsheet Data Toolkit -- New home https://git.sheetjs.com/SheetJS/sheetjs

Apache License 2.0xlsxexcel
sheetjs.com
36.3k7.9k
wailsapp/wails

Create beautiful applications using Go

GoGo ModulesMIT Licensegogolang
wails.io
35.3k1.8k
nrwl/nx

The Monorepo Platform that amplifies both developers and AI agents. Nx optimizes your builds, scales your CI, and fixes failed PRs automatically. Ship in half the time.

TypeScriptnpmMIT Licensenxangular
nx.dev
29.1k2.8k
sudheerj/javascript-interview-questions

List of 1000 JavaScript Interview Questions

JavaScriptnpmjavascriptjavascript-interview-questions
27.5k7.7k