The Most Popular Angular UI Libraries to Try in 2021

This page summarizes the projects mentioned and recommended in the original post on dev.to

Our great sponsors
  • SurveyJS - Open-Source JSON Form Builder to Create Dynamic Forms Right in Your App
  • InfluxDB - Power Real-Time Data Analytics at Scale
  • WorkOS - The modern identity platform for B2B SaaS
  • ngx-bootstrap

    Fast and reliable Bootstrap widgets in Angular (supports Ivy engine)

  • The NGX Bootstrap library has about 5.3K stars on GitHub. Here you can find basic components that implement the capabilities of the Bootstrap template written specially for Angular. It is suitable for developing desktop and mobile applications and is designed with extensibility and adaptability in mind. One of the features of this library is a variety of element forms. Among the element forms that could be added to your application, accordion with custom HTML, various forms of carousels, pager pagination, and different ratings deserve special mention. Custom HTML component of NGX Bootstrap library (source: https://valor-software.com/ngx-bootstrap/) Basic carousel component of NGX Bootstrap library (source: https://valor-software.com/ngx-bootstrap/)

  • Vaadin

    Vaadin 6, 7, 8 is a Java framework for modern Java web applications. (by vaadin)

  • Visual elements from the Vaadin library are designed to bridge the gap between Angular components and Polymer elements. This library supports Material Design and contains components suitable for mobile and desktop development. It should be noted that its components are stored in separate repositories. Other notable features are split layouts, buttons, app layouts, upload Forms, and many others. App Layout component of Vaadin library (source: https://vaadin.com/)

  • SurveyJS

    Open-Source JSON Form Builder to Create Dynamic Forms Right in Your App. With SurveyJS form UI libraries, you can build and style forms in a fully-integrated drag & drop form builder, render them in your JS app, and store form submission data in any backend, inc. PHP, ASP.NET Core, and Node.js.

    SurveyJS logo
  • ngSemantic

    Angular 2 building blocks :package: based on Semantic UI

  • The NG Semantic-UI library includes 27 components and has about 1K stars on GitHub. It is based on the popular Semantic-UI front-end solution, presented as components for Angular applications. It includes such tools as cards, loaders, accordions, menus, and many others. Card component of NG Semantic-UI library (source: https://ng-semantic.herokuapp.com/#/) Forms of Menu component of NG Semantic-UI library (source: https://ng-semantic.herokuapp.com/#/)

  • ng-bootstrap

    Angular powered Bootstrap

  • NG Bootstrap, a popular library that includes Bootstrap 4 style components for Angular, has around 7.7K stars on GitHub. It serves as a replacement for the angular-ui Bootstrap project, which is no longer supported. NG Bootstrap has a high level of test coverage and no third-party JS dependencies. The features that deserve to be highlighted are: datepicker with various options, different progress bars, basic table stylings, different toasts, and others. Datepicker component of NG Bootstrap library (source: https://ng-bootstrap.github.io/) Progress bar component of NG Bootstrap library (source: https://ng-bootstrap.github.io/) Table component of NG Bootstrap library (source: https://ng-bootstrap.github.io/) Forms of Toast component of NG Bootstrap library (source: https://ng-bootstrap.github.io/)

  • components

    Component infrastructure and Material Design components for Angular

  • Material is an official Angular component library that implements Google's Material Design concepts. This library has 21.2K stars on GitHub. These UI components can be thought of as code examples, written according to the guidelines of the Angular development team. Among the interactive elements that can be implemented by using this library, there are autocomplete, form field, progress spinner, slider, stepper, tabs, and others. Visual components of Material library (source: https://material.angular.io/)

  • clarity

    Discontinued Clarity is a scalable, accessible, customizable, open source design system built with web components. Works with any JavaScript framework, built for enterprises, and designed to be inclusive.

  • Clarity is an open-source design system created by VMware that has 6.2K stars on GitHub. It is a combination of UX design guidelines, an HTML/CSS framework, and Angular components. Clarity provides developers with a rich set of high-performance data-bound components. A huge number of interactive elements can be implemented by using this library. Among them, there are accordion, date picker, login, signpost, timeline, toggle, and many others. Visual components of Clarity library (source: https://clarity.design/) Login component of Clarity library (source: https://clarity.design/) Timeline component of Clarity library (source: https://clarity.design/)

NOTE: The number of mentions on this list indicates mentions on common posts plus user suggested alternatives. Hence, a higher number means a more popular project.

Suggest a related project

Related posts