CoreUI ONE — 250+ PRO components and 25+ admin templates for React, Angular, Vue, Bootstrap and Next.js, plus Data Grid, Scheduler, 4,300+ PRO icons and the Next.js boilerplate. One license. → See what you get

Best Angular Modal and Dialog Components (2026): 9 Libraries Compared

Short answer. Choose Angular Material Dialog if you open dialogs from code: MatDialog.open() takes a component or template, supports stacked dialogs and creates the content only while the dialog is open. Choose NG-ZORRO Modal if you want a free modal that can be dragged and comes with confirm, info and error dialogs from a service. Choose PrimeNG Dialog for the most options in one component (dragging, resizing, maximizing, nine positions and a non-modal default), under the PrimeUI License. Choose ng-bootstrap if your app uses Bootstrap and you need stacked modals and responsive fullscreen. Choose CoreUI Modal (free) if you declare modals in templates in a CoreUI or Bootstrap app and do not need nested or draggable dialogs.

How we compared

We compared 9 Angular modal and dialog libraries in October 2026 using each vendor’s documentation, API reference, published package code and current npm release. A ❌ means the vendor’s documentation states the gap. When the documentation is silent we write — (no data), which is not a claim that the feature is missing. CoreUI publishes this page; CoreUI’s own ❌ entries come from its documentation and package code.

The comparison at a glance

Legend: ✅ built in · Partial = class or style workaround, separate component, always on without an option, or limited · ❌ confirmed missing · — no data

Library (version) Sizes Fullscreen Positions Scroll inside Backdrop click closes Nested modals Open from code Non-modal mode Draggable Lazy mount License
Angular Material 22.2.4 ✅ (width, height) Partial ✅ ✅ ✅ ✅ ✅ Partial — ✅ MIT
NG-ZORRO 22.1.2 ✅ (width) — ✅ Partial ✅ ✅ ✅ Partial ✅ ✅ MIT
PrimeNG 22.1.4 ✅ (width, breakpoints) ✅ ✅ (9 positions) ✅ ✅ — ✅ ✅ ✅ — PrimeUI License: free under size limits, $599/dev
ng-bootstrap 21.0.0 ✅ (sm, lg, xl) ✅ (responsive) ✅ (centered) ✅ ✅ ✅ ✅ — — Partial MIT
ngx-bootstrap 22.0.0 ✅ (sm, lg) Partial Partial ✅ ✅ ✅ ✅ — — Partial MIT
Kendo UI Dialog 25.3.0 ✅ (width, height) Partial (Window) ✅ — Partial — ✅ ✅ (Window) ✅ (Window) ✅ Commercial, $799–1,299/dev/year
Taiga UI 5.30.0 ✅ (s, m, l) ✅ Partial ✅ ✅ ✅ ✅ — — Partial Apache-2.0
Spartan/ng 1.8.3 Partial Partial ✅ ✅ ✅ — ✅ Partial — Partial MIT, code copied into your repo
CoreUI Modal 5.7.38 ✅ (sm, lg, xl) ✅ (responsive) ✅ (top, center) ✅ ✅ ❌ Partial ❌ ❌ ❌ MIT

The libraries, one by one

Angular Material Dialog

MatDialog 22.2.4 (MIT) is service-only: MatDialog.open(component | templateRef, config) returns a MatDialogRef with afterOpened, beforeClosed and afterClosed. Several dialogs can be open at once (openDialogs, closeAll), content is created on open and destroyed on close, and position, width, height and animation durations are config options. hasBackdrop: false lets users click the page behind the dialog. Sizes are set as dimensions rather than presets, and fullscreen means setting width and height to the viewport yourself.

Choose it if your dialogs are components opened from code in a Material app.

NG-ZORRO Modal

NG-ZORRO Modal 22.1.2 (MIT) works both ways: [(nzVisible)] in templates and NzModalService.create(), confirm(), info() and other helpers in code. nzOnOk and nzOnCancel can return a Promise or false to keep the modal open, nzDraggable makes it draggable, and content is rendered only when opened. Size is a single nzWidth.

Choose it if you want a free modal with a confirm service and dragging.

PrimeNG Dialog

PrimeNG Dialog 22.1.4 has the most options: nine positions, draggable and resizable, maximizable, width breakpoints for different screens, blockScroll, a headless template, and [(visible)]. It is non-modal unless you set modal. DynamicDialog opens components from a service, and ConfirmationService handles confirm prompts. The license changed in 2026 (see below).

Choose it if you need dragging, resizing or non-modal windows and the PrimeUI License fits.

ng-bootstrap Modal

ng-bootstrap Modal 21.0.0 (MIT) is opened only through NgbModal.open() with a template or component. It supports sm, lg and xl sizes, responsive fullscreen below a breakpoint (since 12.1.0), vertical centering, scrollable content, a static backdrop and stacked modals, and beforeDismiss can cancel closing. Header, body and footer are Bootstrap classes in your template.

Choose it if your app uses Bootstrap and you open modals from code.

ngx-bootstrap Modal

ngx-bootstrap Modals 22.0.0 (MIT) offers a BsModalService and a bsModal directive. Both handle nested modals, static backdrops and scrolling content; sizes and centering come from Bootstrap classes passed in the class option.

Choose it if you already use ngx-bootstrap.

Kendo UI Dialog and Window

Kendo UI Dialog 25.3.0 opens from templates or DialogService, with action buttons and a preventAction hook to stop closing. The separate Window component is the non-modal, draggable, resizable and maximizable option. By default a click on the overlay does not close the Dialog. Kendo UI for Angular requires a paid license.

Choose it if your team already licenses Kendo UI.

Taiga UI Dialog

Taiga UI Dialog 5.30.0 (Apache-2.0) opens through TuiDialogService or the declarative [(tuiDialog)] directive. It has s, m and l sizes, a fullscreen appearance with a responsive variant in the mobile addon, scrolling content, and a Confirm service that can guard forms inside other modals.

Choose it if your app already uses Taiga UI.

Spartan/ng Dialog

Spartan/ng Dialog (brain 1.8.3, MIT) is built on Angular CDK dialog. It works declaratively or from a service with a component, can be anchored to an element, and has examples for scrollable content and a sticky footer. Alert Dialog covers confirmations. Width and animations are Tailwind classes in the copied code.

Choose it if your app follows the shadcn model with Tailwind.

CoreUI Modal

Our own entry. CoreUI Modal is in the free @coreui/angular 5.7.38 (MIT). It is a template-declared component with [(visible)], cModalToggle and header, title, body and footer parts. It offers sm, lg and xl sizes, fullscreen always or below a breakpoint, top or centered alignment, a scrollable body, a static backdrop, an optional portal to document.body and a transition switch.

Where CoreUI loses: the docs state that “multiple modals cannot be opened at the same time”. There is no non-modal mode, no dragging, no service that opens a component or a confirm dialog (the internal ModalService only toggles modals already in a template), no lazy mounting (content stays rendered and hidden when closed), and no event to cancel closing.

Choose it if you build on CoreUI or Bootstrap and your modals are declared in templates. The modal is free; CoreUI PRO adds components such as date pickers and Smart Table (pricing).

What changed in 2026

FAQ

How do I open a confirm dialog from code in Angular?

NG-ZORRO has NzModalService.confirm(), PrimeNG has ConfirmationService, Taiga UI has a Confirm service, and Spartan/ng has Alert Dialog. Angular Material and ng-bootstrap open any component or template you write as the confirm content.

Which Angular modals can be dragged?

NG-ZORRO (nzDraggable), PrimeNG Dialog (draggable, also resizable) and the Kendo UI Window component.

Can I open a modal from another modal in Angular?

Yes in Angular Material, NG-ZORRO, ng-bootstrap (stacked modals), ngx-bootstrap and Taiga UI. CoreUI’s docs state that multiple modals cannot be open at the same time.

Which Angular modals go fullscreen only on small screens?

ng-bootstrap (fullscreen: 'sm' | 'md' | 'lg' | 'xl' | 'xxl'), CoreUI Modal (fullscreen with a breakpoint) and Taiga UI through its responsive dialog in the mobile addon. PrimeNG uses width breakpoints.

Is PrimeNG Dialog still free?

Only under the PrimeUI Community License limits for version 22 and later. Larger teams need a commercial license from $599 per developer, or can stay on PrimeNG 21.1.10, the last MIT release.