DEV Community

loading...
Cover image for 7 Best Angular Component Libraries to use in 2020

7 Best Angular Component Libraries to use in 2020

citrusbug profile image Citrusbug Technolabs Updated on ・3 min read

Angular is one of the elite JavaScript framework with more than 60,000 GitHub stars. Developed by Google and based on TypeScript, Angular is capable of delivering great web applications with high web page performances.

With consistent updates, Angular has rooted its place in the list of best web development frameworks. Popular brands like PayPal, Upwork, Netflix also use Angular in their frontend development.

However, there are plenty of Angular component libraries to choose from and in order to find the most suitable one, you need to dig deeper into each library which might get tedious for you.

So, here are some of the best Angular component libraries to use in 2020:-

Best Angular Libraries in 2020

1) Angular Material

Formerly known as Material2, Angular Material is an official component library built by Angular and TypeScript that focuses on implementing Google’s material design. It follows the best UI practices including adding the new feature promptly from command line templates.

Github Stars: 20,000+
Weekly npm downloads: 480,000+
Latest update: 8.0.1

Some Angular components you can use in this library are:-

  • Pop up creation such as snackbar and Dialog
  • Progress bar, progress spinner
  • Icos and chips
  • Layout components such as Grid list, Tabs, Cars etc.
  • Toolbar menu and Navigation bar

2) NG Bootstrap

This Angular Library offers bootstrap 4 components and replaces Angular UI-bootstrap.

NG bootstrap provides very high testing coverage while removing all the third party JS dependencies.

Github Stars: 7000+
Weekly npm downloads: 200,000+
Latest update: 5.0.0-rc.0

Some Angular components you can use in this library are:-

  • Tooltip
  • Popover
  • Typehead
  • Modal
  • Datepicker

3) NG Semantic UI

Ng Semantic library is built on Angular 2 and Semantic UI which is one the most popular and used UI components in the market.

Github Stars: 1000+
Weekly npm downloads: 461+
Latest update: 1.1.13

Some Angular components you can use in this library are:-

  • Message
  • Rating
  • Menu
  • List
  • Segment
  • Select
  • Button
  • Sidebar
  • Flag

4) Prime NG

This is one of the most prestigious library of Angular framework with a set of 80+ UI components that is aligned with vast themes.

Also, customizing the components becomes easy in Prime NG due to its professional design and that is the main reason behind many big brands like eBay using this component library.

Github Stars: 6000+
Weekly npm downloads: 178,000+
Latest update: 8.0.0

Some Angular components you can use in this library are:-

  • Uploading file component
  • Overly components such as panel and lightbox
  • Toolbar & scrollpanel
  • Tabview panel
  • Data components like Datalist & Datagrid

5) Clarity

Clarity is an open-source design system that came from VMware. It basically brings HTML and CSS components together along with Angular components.

Moreover, Clarity is an amazing library which can be useful for both i.e designers and developers.

Github Stars: 6000+
Weekly npm downloads: 11,000+
Latest update: 2.0.1

Some Angular components you can use in this library are:-

  • Login page
  • Grid
  • Passwords
  • Progress bars
  • Alerts
  • Toggle switches
  • Radio buttons

6) NGX Bootstrap

This component library offers all the core bootstrap component that comes under Angular. It is one of the favorite library of Angular developers because it allows them to use many bootstrap features.

Another unique thing about this NGX Bootstrap is that it is compatible with both, desktop as well as mobile devices.

Github Stars: 5100+
Weekly npm downloads: 11,000+
Latest update: 2.0.1

Some Angular components you can use in this library are:-

  • Pagination
  • Alerts
  • Datepicker
  • Typehead
  • Collapse
  • Accordion

7) NG ZORRO

It is written in TypeScript and based on Ant design and offers entire enterprise - class UI. It is indeed regarded as the most optimal solution in the development of web applications and also oftenly used in SaaS Application Development .

Popular brands using NG-Zorro component library of Angular:-

  • Alibaba
  • Apache Flink
  • Thoughworks

Github Stars: 6800+
Weekly npm downloads: 33,000+
Latest update: 7.5.1

Wrapping up:-

So, these were the 7 best Angular component libraries you could use in 2020. There are many popular and successful Angular websites who are using this elite JS framework and its libraries in such a perfect way. You can also choose the best ones according to the requirements of your project.
If you need Angular experts, Citrusbug is always happy to help :)

Discussion (7)

pic
Editor guide
Collapse
hopemanryan profile image
Ryan Hoffman

So I have used many of these frameworks. Currently ng-zorro is my favorite, it just gives more out of the box, very little overhead than like material, also changing css for ng-zorro components I found easier that prime/material

Collapse
brunovieira97 profile image
Bruno Vieira

Hey! I just added ng-zorro to my project, but VS Code can't give me IntelliSense for importing its modules. Do you have the same problem? With Angular Material, IntelliSense works out of the box: I just type the module name anywhere and it allows me to import through Ctrl+Space.

Collapse
hopemanryan profile image
Ryan Hoffman

github.com/ng-alain/ng-zorro-vscode

Maybe with this?
I use webstorm so no issue for me

Collapse
citrusbug profile image
Citrusbug Technolabs Author

Thanks Ryan for sharing your opinion. We do use Ng-zorro a lot :)

Collapse
chafik_jamaa profile image
BJ Chafik_js_tools_web

very good tools. all thanks

Collapse
citrusbug profile image
Collapse
carl0smore1ra profile image
Carlos Moreira

Used by TOTVS and open source
po-ui.io/