StreamerFlux

Shoelace Component Library / Brutalist Zine Theme

Buttons

Variants

Default Primary Success Neutral Warning Danger

Sizes

Small Medium Large

States

Outline Disabled Loading Pill

Button Group

Left Center Right

Icon Buttons

Form Controls

Input

Input Variants

Textarea

Select

Option 1 Option 2 Option 3 Alpha Beta Gamma

Checkbox

Unchecked
Checked
Indeterminate
Disabled

Switch

Default
Checked
Disabled

Radio Group

Option 1 Option 2 Option 3

Radio Buttons

List Grid Table

Range

Color Picker

Rating

Feedback

Alerts

Info: This is a primary alert. Success: Operation completed. Warning: Please be careful. Error: Something went wrong.

Badge

Primary Success Neutral Warning Danger
Pill Pulse

Tag

Primary Success Neutral Warning Danger
Small Medium Large
Removable

Progress Bar

Progress Ring

Spinner

Skeleton

Navigation

Tab Group

Tab 1 Tab 2 Tab 3 Content for tab 1 Content for tab 2 Content for tab 3

Breadcrumb

Home Products Category Item

Menu

Option 1 Option 2 Option 3 Checkbox Disabled

Dropdown

Dropdown Item 1 Item 2 Item 3 Item 4

Tree

Folder 1 File 1.1 File 1.2 Folder 2 File 2.1 File 3

Overlays

Dialog

Open Dialog This is a dialog. You can put any content here. Close

Drawer

Open Drawer This is a drawer. It slides in from the side. Close

Tooltip

Top Right Bottom Left

Data Display

$2,847
Total Tracked
142
Transactions
87%
Goal Progress
3.2k
Followers

Card

Card Title

This is a basic card with some content.

Action

Avatar

Details (Accordion)

This is the expanded content. It can contain anything. More content here.

QR Code

Copy Button

Copy "Hello, World!"

Divider

Content above

Content below

Left Right

Icons

Bootstrap Icons

Icon Sizes

Media

Carousel

Istanbul sunset Lake house Mountain walkway Forest

Image Comparer

Forest Istanbul

Utilities

Format Date



Format Number



Format Bytes



Relative Time


Split Panel

Start
End

Animation

Animation Component

More Animations

rubberBand
jello
flash
pulse