L

Lustro

Bootstrap 6.0.0-alpha.1 · scoped preview

Light mode

Fictitious data. Interactive toasts and dialogs use Bootstrap 6 ESM. Chart-heavy Lustro pages stay on the VitePress catalog with existing motion.

Buttons: variants

PrimarySecondarySuccessWarningDangerInfoLightLink

Buttons: outline

PrimarySuccessWarningDangerInfo

Buttons: sizes

SmallDefaultLarge

Buttons: disabled

PrimaryDefaultOutlineLink

Buttons: block and full width

Full width primaryFull width outline

Buttons: shapes

PillDefaultSquare

Buttons: active and toggle

ActiveToggled onToggled off

Buttons: with icons and counters

+ New⇩ Download✎ EditInbox 4✓

Buttons: loading

Saving Loading Please wait

Button groups: basic and sizes

LeftMiddleRight123AB

Button groups: toolbar and vertical

1234567TopMidBottom

Button groups: checkbox and radio style

Checkbox 1Checkbox 2Checkbox 3Radio 1Radio 2Radio 3

Button groups: with dropdown

Action▾LeftRightMore ▾

Badges: variants

PrimaryNeutralSuccessWarningDangerInfoOutline

Badges: pill, square, dot and in buttons

PillSquare OnlineNotifications 9Profile new

Badges: positioned on a button

Inbox 99+✉

Alerts: variants

Primary A simple alert with a link.

Alerts: with heading and actions

Well done
You completed the setup. Next, invite your team.

Invite Later

Alerts: dismissible and with icon

⚠Your trial ends in 3 days.✕

Cards: basic, header and footer

Card title

Some quick example text to build on the title.

Go

Cards: with image, horizontal and highlighted

Cards: list and grid groups

Includes

Forms: text inputs

Email

Forms: sizes, textarea and file

⇧ Choose file

Forms: validation

Valid

Looks good.

Forms: input groups

@

Forms: floating labels and layout

First name

Select: variants

DefaultChoose...One

Checks and radios

✓ Checked Unchecked– Indeterminate Disabled

Switches

On Off Disabled on Disabled off

Range

Example range

Nav and tabs

• ActiveLinkLinkDisabled

Nav: vertical and tab panes

ProfileBillingTeam

Pagination

«123»«123»123123

Breadcrumbs

Home

Dropdowns

Actions ▾

ActiveAnother actionSomething else

---

Disabled

Modals

Modal title✕

Tooltips

Tooltip on topTooltip on bottomTooltip leftTooltip right

Popovers

Popover title

Progress

Spinners

List groups

Active item

Tables: basic, striped and hover

#	First	Last	Handle
1	Mark	Otto	@mdo
2	Jacob	Thornton	@fat
3	Larry	Bird	@twitter

Tables: bordered, small, dark header and states

#	First	Last	Handle
1	Mark	Otto	@mdo
2	Jacob	Thornton	@fat
3	Larry	Bird	@twitter

Accordion

Accordion item #1

This is the first item body. Open by default.

Collapse

Toggle contentToggle both

Toasts

Noticejust now✕

Offcanvas

Offcanvas✕

Carousel

Slide one

Avatars and stacks

ADADADABCDEF+4

Placeholders and skeletons

Steps and keyboard keys

✓ Account2 Details3 Review