Native Components for Angular 2+

Powerful, flexible, and easy-to-use!

SavvyUI is a feature-rich component library for the development of Angular 2.0+ applications. It features a large set of native Angular components that can be used to create complex UI applications using Angular and Typescript. All the components have a familiar and easy to use API that can be used declaratively and programmatically. It comes with multiple built-in themes that can be employed as-is, or they can be easily customized as needed.

Click here for a demo, and to browse through the guide tutorials for this library

SavvyUI Angular Components

Ghantt Chart Component

Ghantt Chart

Easy-to-use ghantt chart component to show the duration and progress of tasks, dependency between tasks, the resource assigned to each task in a hierarchy that reflects the relationship between stories and their sub-tasks.

Modal Popup

The SavvyUI library provides 2 modal dialog classes, one that is used to display Angular 2 templates in a modal popup, and the other one is used to dynamically create modal popups from native html markup. The dynamic dialog class also includes built-in functions to display out-of-the-box confirmation and message dialogs, an InputDialog helper that includes helpers to add all kinds of input elements without dealing directly display with HTML markup. Either one of these classes can be used to display modal popups, but they provide developers with greater flexibility, and more functionality.

Modal Popup Dialog

Picture Menu Component

Picture Menu

The picture menu component can be used to display a grid of static image icons, display interactive menus with pictures that fire events whenever a picture is clicked, which makes a perfect solution for displaying menus to the user that display both text and images for touch-screen behavior.


Powerful component to generate and display QR Barcodes from any string. These QR barcodes can be used to display a barcode that can be scanned directly off the display screen.

QrCode Barcode

Button Component


A single button component that can be configured to display 4 styles of buttons, primary, default, danger, and info.

Button Group

Button groups are a series of buttons that can be used more like checkboxes and radio buttons. Group buttons can be configured to allow multiple selection just like check boxes, or a single selection similar to a radio button group.

Button Group Component

Check Box Component

Check Box

The checkbox component is used to display a 2-state button to give the user to choose one of two options.

Check List

The checklist component is used to display a list of checkbox items. This type of component is presented to the users in situations where the options can be turned on or off for a particular entity. For example, assigning roles to employees is a perfect scenario for using such a component, where the employee can be assigned one or more roles depending on the employee title.

Check List Component

Card Component


The Card component can be used to display products, profiles, and product details. They provide another way to display employees profile, product information, product pricing, and more.


Chip Component

Accordion Component



Alerts Component

Calendar/Date Picker


Bar Chart

Bar Chart

Data Grid/Table

Support for inline editing, embedded form editing, and popup dialog editing, paging, scrolling, sorting, filtering, built-in support for a vast number of editing styles.

Data Grid


Chart component that includes a pie chart, a doughnut chart, a bar chart, and a line chart. No dependency on any other library.

line Chart
Doughnut Chart

Appointment Book

Advanced appointment scheduling component that supports built-in editing capability, dragNDrop, scrolling, and more.

Appointment Book
Form designed with the SavvyUI Angular Components library