Modal Title Reference

Modern dialog boxes and popup windows for your website. Modals are a part of Bootstrap 5 framework and they’re the easiest way to tell your users something important, let them like your Facebook page, subscribe for updates… any content you need! Bootstrap 5 component. Add the component and configure its properties in the Inspector.

Inspector Property Groups

Modal Title Properties

Property	Type	Details
ID	text	ID for the title element. Sets the id attribute on the modal title element. This may be used for ARIA labeling (e.g. aria-labelledby ). Bootstrap docs: Accessibility Attribute: id
Class	text	Extra classes for the title. Adds extra CSS classes to the modal title element. Use this to apply typography utilities or custom styles. Bootstrap docs: Text utilities Attribute: class
Text	text	Title text. Sets the modal title text. Titles help users understand what action they are about to take. Bootstrap docs: Modal Supports dynamic option sources.

Text

Property	Type	Details
Advanced	css_toggle	Advanced layout options. Advanced layout options provided by the rule. These typically map to Bootstrap utility classes (spacing, flex, display) to fine-tune layout. Bootstrap docs: Utilities API
Color	color_group	Options: text-primary, text-primary-emphasis, text-secondary, text-secondary-emphasis, text-success, text-success-emphasis
Text Opacity	range
Align	button_group	Controls text alignment. Controls text alignment using Bootstrap text utilities. Applies classes like text-start , text-center , text-end , including responsive variants (e.g. text-md-center ). Bootstrap docs: Text utilities Options: text-start, text-center, text-end
Font Weight	button_group	Controls font weight. Controls font weight using Bootstrap font-weight utilities. Applies fw-light , fw-normal , fw-bold , etc. Bootstrap docs: Font weight Options: B, B+, N, L, L+
Line Height	button_group	Controls line height. Controls line height using Bootstrap line-height utilities. Applies lh-1 , lh-sm , lh-base , or lh-lg . Bootstrap docs: Line height Options: 1, SM, BS, LG

Appearance

Property	Type	Details
Back Color	color_group	Options: text-bg-primary, bg-primary, bg-primary-subtle, text-bg-secondary, bg-secondary, bg-secondary-subtle
Back Opacity	range	Controls background opacity. Controls background opacity when using background color utilities. Applies classes like bg-opacity-25 , bg-opacity-50 , etc. Bootstrap docs: Background utilities
Width	range	Sets a Bootstrap width utility class. Sets a Bootstrap width utility class. Applies utilities like w-25 , w-50 , w-75 , w-100 , or w-auto . Bootstrap docs: Sizing
Height	range	Sets a Bootstrap height utility class. Sets a Bootstrap height utility class. Applies utilities like h-25 , h-50 , h-75 , h-100 , or h-auto . Bootstrap docs: Sizing
Opacity	range	Sets the opacity utility class. Sets an opacity utility class. Applies utilities such as opacity-25 , opacity-50 , opacity-75 , or opacity-100 . Bootstrap docs: Opacity
Shadow	droplist	Applies a Bootstrap shadow utility. Applies a Bootstrap shadow utility. Uses classes like shadow , shadow-sm , shadow-lg , or removes shadow with shadow-none . Bootstrap docs: Shadows Options: Default, None, Small, Regular, Large

Spacing

Property	Type	Details
Margin<br>&<br>Padding	spacing
X Gutter	range	Horizontal gutter size. Sets the horizontal gutter (spacing between columns). Uses gx-* utilities to control the horizontal gutter size. Bootstrap docs: Gutters
Y Gutter	range	Vertical gutter size. Sets the vertical gutter (spacing between rows). Uses gy-* utilities to control the vertical gutter size. Bootstrap docs: Gutters

Display

Property	Type	Details
Hide on	button_group	Options: xs, sm, md, lg, xl, xxl
Print	button_group
Visually Hidden	boolean
Focusable	boolean