GitHub

Data Display

Present structured content with cards, tables, avatars, accordions, and other display components.

Card

Versatile container for grouping related content. Supports headers, images, footers, and action buttons.

Team Standup
Daily sync at 9:00 AM PST

Review sprint progress, blockers, and priorities for the day.

Design System v2.0
Shipped March 15, 2025

New tokens, components, and docs.

Pro Plan
$29/month, billed annually
  • Unlimited projects
  • Priority support
  • Custom domains

Table

Structured data table with sortable columns, status badges, and row-level actions.

NameEmailRoleStatus
SCSarah Chen
sarah.chen@leucine.ioAdmin
Active
MJMarcus Johnson
marcus.j@leucine.ioEditor
Active
PPPriya Patel
priya.p@leucine.ioViewer
Inactive
JWJames Wilson
james.w@leucine.ioEditor
Active
ARAisha Rahman
aisha.r@leucine.ioAdmin
Active

Avatar

Circular avatar with image, initials fallback, and optional online/offline status indicator.

XSxs
SMsm
MDmd
LGlg
XLxl
SCMJPP
SC
MJ

Avatar Group

Stacked avatars for showing team members or participants with an overflow count.

SCMJPPJW+4

Accordion

Expandable content sections for FAQs, settings groups, and information-dense interfaces.

Collapsible

Toggle visibility of a content section with a trigger button — useful for optional details.

3 starred repositories

@leucine/design-system

Separator

Visual dividers for separating content sections — available in horizontal and vertical orientations with optional labels.

Section A content

Section B content

Or
Blog
Docs
Source