Material Design started in 2014 and it was introduced by Google to provide a consistent look and feel across browsers. It combines animation effects with soothing colors, shadows, aptly measured margins/padding etc to improve the User experience. Back in the era of Flash/Flex, components designed using Flex has a visual appearance which felt natural. Without any need of adding styles, the plain Flex User Interface felt good. HTML components were lacking such natural appearance. Maintaining consistency across the browser was always a pain. With Material Design the UI aesthetics and interaction has improved dramatically.
Though Angular CLI enables you to quickly get started with creating a new project, it doesn’t come bundled with the Material design. Additional steps are required to integrate the Material Design and apply the styling to the components. In this article, we will learn the steps to integrate Material Design in Angular 6. We will extend this article and build following UI to understand some of the Material Design Components.