Start building with Angular
Follow this step-by-step guide to start developing with the Visa Product Design System in Angular.
Step 1: Update Angular
Nova Angular supports Angular 18, 19, and 20. See Angular’s guide on how to upgrade Angular from your current version to the target version.
Step 2: Install the library
You can install the Nova Angular library using the package manager of your choice. Below we’ve provided the most common: NPM, PNPM, Yarn, and Bun.
Note: Package managers can resolve dependencies differently and might not automatically install all required dependencies.
Step 2b: Component-specific installs
If you’re using Dialog, install the Angular cdk package.
Some package managers may require you to install our peer dependency packages if you don’t have them already:
Note: Install a version of @angular/forms that matches the version of Angular you are using.
Step 3: Set up the application
Step 3a: Import Nova styles
Import the Nova styles library and theme in your angular JSON or equivalent file. Visa is the default theme, but can be replaced with other available themes. To learn more, visit Theming, and for more about Nova styles, visit Get started for Styles (CSS).
Step 3b: Import the Nova Angular component library
Import our library into your standalone component or NgModule.
Step 4: Add icons (optional)
Nova Angular can be used with Nova icons or a custom icon library. This documentation and the component examples use the Nova icons library. In addition, Angular icons are available as standalone icons or icon sprites. They can be imported into your standalone component file, or your NgModule.
Install Nova icons
Standalone icons (recommended)
If you need just a few icons, you can import them directly from , then use the icons directly inside your HTML.
HTML
Icon sprites
If you need many icons or prefer a single import for all icons of a type, you can use icon sprites. Import them directly from , then use the icons inside your HTML.
HTML
Step 5: Use the components
After adding Nova icons, you’re ready to use Angular components by copying and pasting the example code into your application. Check out Button to give it a try.
Need help?
If you experience any issues while getting set up with Nova Angular, visit Support or create an issue .