⚠️ Mobile is not supported yet.

flx

A collection of customizable UI blocks with interactive live previews

Website

Add Filters

@flx/input-06

Spinning loader in the trailing addon while searching.

block

@flx/avatar-08

Avatar beside a name and email, forming a user row.

block

@flx/input-17

Attach button plus InputGroup message field and send action in a ButtonGroup.

block

@flx/select-05

Each option shows a bold label and a muted description sub-line; the trigger displays the full two-line item when selected.

block

@flx/table-03

Borderless rows for a clean, list-like layout.

block

@flx/input-09

Info button in the trailing addon opens a popover with helper content.

block

@flx/button-27

Color swatch button that opens a grid of color swatches, paired with a hex value label in a merged-border row.

block

@flx/input-05

URL input with a fixed "https://" prefix and ".com" suffix text addons.

block

@flx/banner-14

Live import banner with a spinner and a progress bar.

block

@flx/input-14

ButtonGroup pairs a text input with a trailing search action button.

block

@flx/button-26

Sort dropdown paired with a direction-toggle icon button in a merged-border row.

block

@flx/tooltip-03

Label paired with a keyboard shortcut badge inside the tooltip.

block

@flx/badge-04

A colored presence dot beside an outline label.

block

@flx/accordion-16

Two-line trigger pairing a title with helper text.

block

@flx/item-07

Small image thumbnail placed before the title and subtitle.

block

@flx/input-08

Help icon in the trailing addon opens a tooltip on hover.

block

@flx/button-05

Button with an icon placed after the text label.

block

@flx/table-05

Column grid lines via per-cell right borders.

block