Display
Explore the live examples that also power your theme customizer.
27 components
Avatar
Image and fallback initials primitive for identity surfaces such as profiles and assignees.
@threadlabs/looma
Name, fallback, and sizes
Avatar Group
Container that displays overlapping avatars with an optional "+N" overflow pill when the count exceeds the visible maximum.
@threadlabs/looma
Default maximum
Team notes
A clear place for shared work.
| Customer | Items | Total |
|---|---|---|
| Ada Park | 3 | $124.00 |
| Ben Ortiz | 1 | $18.50 |
| Chen Wu | 5 | $302.10 |
Data Table
A table of rows, with columns written as markup and frozen columns and rows.
@threadlabs/looma
Orders table
- Site
- Acme
- Invited by
- Ada Lovelace
- Role
- Editor
Disclosure
Progressively enhances a button/content pair into an accessible disclosure.
@threadlabs/looma
Default closed
Image
A semantic image surface with optional selection, corner resizing, and text wrapping.
@threadlabs/looma
Image
- Roadmap
- Onboarding
- Glossary
Nav Item
One destination in a side or rail navigation: the sections of a product, or the parts of a record.
@threadlabs/looma
Sidebar
Notice Stripe
Edge-to-edge announcements with optional actions and dismissal.
@threadlabs/looma
Announcement with action
Planning
Roadmaps, decisions, and the reasons behind them.Recently updated
Pages edited in this workspace, newest first.
Site Header
Site branding and navigation with an automatic mobile drawer.
@threadlabs/looma
Compact header
Status Message
Loading, empty, and failed states within a content area.
@threadlabs/looma
Empty state
| Page | Status |
|---|---|
| Roadmap | Draft |
| Guide | Ready |
Tabs
Tablist primitive that synchronizes tab focus, selection, and panel visibility.
@threadlabs/looma
Default horizontal
Clear ideas.
Space to make them happen.
Updated today
Application toolbar
A sticky app toolbar for a title, search, and contextual actions.
@threadlabs/looma
Default
Tree
An accessible hierarchy with disclosure, bounded logical indentation, and truthful drag-and-drop previews.
@threadlabs/looma
Project files
Add details
Enter the details for this stage, then continue to review.