CoreUI for Angular is a UI Component library written in TypeScript, and ready for your next Angular project. Learn how to include CoreUI Angular Components in your project.
Installation
Prerequisites
Before you begin, make sure your development environment includes Node.js® and an npm package manager.
Node.js
Angular 22 requires Node.js LTS version ^22.22.3, ^24.15.0 or ^26.0.0.
- To check your version, run
node -vin a terminal/console window. - To get
Node.js, go to nodejs.org.
Angular CLI
The Angular CLI is a command-line interface tool that allows you to scaffold, develop, test, deploy, and maintain Angular applications directly from a command shell.
Install the Angular CLI globally using a terminal/console window.
npm install -g @angular/cliSee also: Angular setup
Angular CLI
CoreUI v5.7 for Angular 22 supports ng add to install all required dependencies for your Angular project.
ng add @coreui/angularNpm
Your other option is to use npm install directly.
npm install @coreui/angular @coreui/coreui @coreui/icons-angularUsing components
import { AlertModule } from '@coreui/angular';
@NgModule({
imports: [AlertModule,]
})
export class AppModule(){}Standalone components
Starting from version 4.4.x CoreUI Angular components are marked as standalone: true.
Animations
Since version 5.7.25 no CoreUI Angular component uses the @angular/animations module — every
animation runs on CSS transitions. You no longer need BrowserAnimationsModule or
provideAnimationsAsync() for our components, and @angular/animations can be dropped from your
dependencies unless your own code uses it.
| Component | retired from |
|---|---|
5.7.25 | |
5.7.15 | |
5.7.15 | |
5.7.15 | |
5.7.15 | |
5.7.15 | |
5.7.15 | |
5.7.4 |
On earlier versions the components listed above needed the animations provider, imported as
BrowserAnimationsModule with NgModules or provideAnimationsAsync() with standalone components.
Providers
To ensure that the Sidebar and Dropdown functions correctly, you might need to import the required providers. Depending on the configuration of your project, this should be done in either app.module, app.config, or app.routes.
...
importProvidersFrom(SidebarModule, DropdownModule)
...Stylesheets
Angular components are styled using @coreui/coreui CSS library, but you can use them also with bootstrap CSS library.
That is possible because @coreui/coreui library is compatible with bootstrap, it just extends its functionalities. The
only exception is custom CoreUI components, which don’t exist in the Bootstrap ecosystem.
CoreUI CSS files
Installation
npm install @coreui/coreuiBasic usage
@import "@coreui/coreui/scss/coreui";See also: Customize CoreUI CSS
Bootstrap CSS files
Installation (optional)
npm install bootstrapBasic usage
import 'bootstrap/dist/css/bootstrap.min.css'