Utilities

Balance $ 2,317
Item Sold 1230

Borders

Use border utilities to add or remove an element’s borders. Choose from all borders or one at a time.

Border Width
.border
.border-1
.border-2
.border-3
.border-4
.border-5
Additive
.border
.border-top
.border-end
.border-bottom
.border-start
Subtractive
.border-0
.border-top-0
.border-end-0
.border-bottom-0
.border-start-0
Border Color
.border-primary
.border-secondary
.border-success
.border-danger
.border-info
.border-warning
.border-dark
Border Opacity
default
.border-opacity-75
.border-opacity-50
.border-opacity-25
.border-opacity-10
Border Radius
.rounded
.rounded-top
.rounded-end
.rounded-bottom
.rounded-start
.rounded-circle
.rounded-pill
Border Radius Sizes
.rounded-0
.rounded-1
.rounded-2
.rounded-3
.rounded-4
.rounded-5

Text Opacity Colors

To change that opacity, override --bs-text-opacity via custom styles or inline styles.

This is default primary text

This is 75% opacity primary text

This is 50% opacity primary text

This is 25% opacity primary text

Background Opacity Colors

Or, choose from any of the .bg-opacity utilities:

This is default success background
This is 75% opacity success background
This is 50% opacity success background
This is 25% opacity success background
This is 10% opacity success background

Stacks - Vertical

Use .vstack to create vertical layouts. Stacked items are full-width by default. Use .gap-* utilities to add space between items.

First item
Second item
Third item
Vertical Stacks Example

Stacks - Horizontal

Use .vstack to create vertical layouts. Stacked items are full-width by default. Use .gap-* utilities to add space between items.

First item
Second item
Third item

Using horizontal margin utilities like ms-auto as spacers:

First item
Second item
Third item
Horizontal Stacks Examples

Shadows

While shadows on components are disabled by default in Bootstrap and can be enabled via $enable-shadows, you can also quickly add or remove a shadow with our box-shadow utility classes. Includes support for .shadow-none and three default sizes (which have associated variables to match).

No shadow .shadow-none
Small shadow shadow-sm
Regular shadow shadow
Larger shadow shadow-lg
© Lexa - Crafted with by Themesbrand.