Now UI Kit Angular is a free, responsive Angular UI kit built on Bootstrap 4 by Creative Tim and Invision, delivering over 50 styled components and three ready-made page templates for landing, login, and profile screens.
What is Now UI Kit Angular?
Now UI Kit Angular is a free component library that brings Invision's Now design language to Angular applications. It is built on Bootstrap 4, so it inherits the 12-column grid and fallback behavior for unstyled Bootstrap elements. The kit ships as a complete Angular CLI project with components organized under src/app/components, example pages under src/app/examples, and SCSS styling in src/assets/sass/now-ui-kit.scss. You can copy the components into an existing Angular project or run the scaffold directly.
The kit is a collaborative release from Invision and Creative Tim, and the same design is available in PSD and Sketch formats on Invision's site.
Key Features
- Bootstrap 4 foundation — Uses Bootstrap 4's grid and components, so any element not explicitly redesigned falls back to Bootstrap defaults.
- 50+ UI elements — Includes basic elements, typography, modals, notifications, navigation, and Nucleo icons, all styled with bold colors and flat design.
- Three example pages — The src/app/examples folder contains working landing, login, and profile page templates with Angular routing.
- Angular CLI project — Comes with angular.json, src/app, and src/assets directories; install dependencies with npm install, then serve with npm start at localhost:4200.
- SCSS customization — Styles are authored in SCSS files, including a main now-ui-kit.scss, allowing developers to adjust variables and colors.
- One-click deploy — The README includes a Deploy to Genezio button that provisions a live version of the template on Genezio.
- Free with a PRO upgrade — The kit is free; Creative Tim sells Now UI Kit PRO Angular from $79 for additional components and templates.
Who is it for?
- Angular developers building flat, modern UIs without starting from a blank stylesheet.
- Product teams that need polished marketing, login, and profile pages quickly for MVPs or internal tools.
- Designers and developers working together — the UI kit mirrors Invision's free PSD/Sketch Now files, so both sides can stay visually aligned.
What can you do with Now UI Kit Angular?
- Build a product landing page: Use the included landing template to present features with bold colors, large typography, and spacious sections.
- Add a login flow: Drop the login page template into your Angular app and wire it to your authentication service.
- Create a user profile screen: The profile template demonstrates media, typography, and layout patterns for member pages.
- Prototype faster with InVision: Export the same visual styles to InVision prototypes to gather feedback before final development.
How does Now UI Kit Angular work?
The template is a complete Angular project. To run it locally, install Node.js, then execute npm install -g @angular/cli, npm install, and npm start in the project root. The app compiles with the Angular CLI and serves at localhost:4200. From there, you can edit the SCSS in src/assets/sass or reuse the components under src/app.
Pricing
Now UI Kit Angular is free to download and use. Creative Tim also sells a PRO version — Now UI Kit PRO Angular — starting at $79, which adds more components and example pages.
Alternatives
- Angular Material — Google's official Material Design component library for Angular, offering a different visual language and a large set of components.
- NgBootstrap — Angular-native Bootstrap components that stay close to default Bootstrap styling, without the Now customization.
FAQ
Is Now UI Kit Angular free?
Yes, the kit is free. Creative Tim also sells a PRO Angular version with additional features, starting at $79.
How do I run Now UI Kit Angular?
Install Node.js, then run npm install -g @angular/cli, npm install, and npm start in the project folder. The app will be available at localhost:4200.
Which example pages are included?
The kit includes three example pages: a landing page, a login page, and a profile page, located in src/app/examples.
Can I use it with an existing Bootstrap 4 project?
Yes, because the kit is built on Bootstrap 4, you can import the Now UI Kit SCSS over your existing Bootstrap 4 project. Unstyled elements retain their Bootstrap defaults.
