Borders & Radius Shapes
Control element borders, widths, theme border colors, and corner rounding styles.
Rounded
Circle
Pill Shape
Top 3px
Start 4px
Shadow Depths
Add depth to layout panels using standard shadow class utilities.
Small Shadow (.shadow-sm)
Regular Shadow (.shadow)
Large Shadow (.shadow-lg)
No Shadow (.shadow-none)
Spacing Scale (Padding & Margins)
Bootstrap spacing ranges from size 1 (`0.25rem`) to size 5 (`3rem`) for consistent scaling.
Size 1 (.p-1)
Size 2 (.p-2)
Size 3 (.p-3)
Size 4 (.p-4)
Flexbox Distribution
Align and distribute flex container columns using spacing utility classes.
Centered
Items
Left
Right
Around 1
Around 2
Opacity Levels
Adjust visibility levels of target layout layers using opacity classes.
100%
75%
50%
25%
Text Helper Classes
Handle content wrapping, clipping, and text truncation cleanly.
This is a long line of text that will be truncated because it overflows the maximum configured width
constraint.
This text block will be fully highlighted on a single click.
This text cannot be selected by the cursor.