ng-bootstrap Modal size

March 31, 2023 by Tarik

The cleanest solution that I could find is to use the windowClass property.

I.e.:

this.modalService.open(MyModalComponent,  { windowClass : "myCustomModalClass"});

Then add the following to your global CSS styles. This is important as the style won’t be picked up from your components CSS.

.myCustomModalClass .modal-dialog {
  max-width: 565px;
}