Ctrl + k

Modal

The Modal component is a basic way to present content above an enclosing view.

Default

ModalBody component is used to add body content. ModalFooter component is usually used to add actions in the model's footer.

You can enable X button on top-right corner by setting dismissible prop to true.

Customize header by adding ModalHeader component inside modal. Also, you can add ModalTitle component inside ModalHeader to add title.

You can make modal's content scrollable using scrollable prop.

You can set modal's size using size prop. Available sizes are sm, md and lg. Default size is md.

Set placement property to center to vertically center the Modal. Default value is top.

Set AutoClose property to true to close Modal when Escape key pressed or clicked outside.

Disables the backgruond dimming effect by setting backdrop property to false.