Buttons

ACTIONS
Variants
Sizes & states
Icon buttons

Cards

SURFACES
Card variants

Default

Standard Memphis frame.

Body copy on the canonical card surface.

Featured

Primary-tinted shadow.

Highlighted version using --primary as shadow colour.

Elevated

Larger Memphis shadow.

Pulled forward with shadow-memphis-lg.
Product cards
LC
Lisa Conte
Online · 2 min fa
Online

Speed setup

Pannelli pre-configurati per ridurre il time-to-first-deploy.

15+10
REGOLA

Read me first

Scheda neutra per regole, cambi di policy, note descrittive.

Banners

STATUS
All four tones
Info
Lib + docs in dry-run mode. Pubblicazione manuale.
Success
Tutto verde. Pronto al merge.
Warning
Token rimossi: rebuilda il dist prima del typecheck.

Overlays

DIALOG · DRAWER · POPOVER
Triggers

Form inputs

DATA ENTRY
Text fields
Massimo 32 caratteri.
Formato non valido
Toggles
Sliders
Selectors
Date & autocomplete

Feedback

STATE
Loaders & progress
Badges
defaultfeaturedsuccesswarninginfodestructiveoutline
Chips
defaultaccentbrandsuccesswarningdanger
Toast
    Hints
    1

    Token-driven

    Reagisce a --secondary (sfondo) e --memphis-shadow-color.

    2

    Card shadow

    Usa --shadow-memphis-card per la sua elevazione.

    Data display

    LISTS · TABLES · METRICS
    Stats
    Visite
    12.4k+8.2%
    Ordini
    184-1.6%
    Conv.
    3.1%
    MRR
    €42k+24%
    Charts
    12345
    App pattern
    Medals
    3Bronze
    2Silver
    1Gold
    MMaster
    GMGM
    Avatars (initials only — no remote images)
    MRGBLV
    A
    B
    C
    D
    +2
    Accordion

    Table
    Utenti recenti
    NomeRuoloUltimo accessoStato
    Mario RossiAdmin2025-04-10Attivo
    Giulia BianchiEditor2025-03-22In attesa
    Luca VerdiViewer2025-02-04Bloccato
    Totale3

    Layout primitives

    STRUCTURE
    Separators
    Top
    Center
    Bottom
    Decorative shapes
    Scroll & ratio containers
    ScrollArea
    Riga numero 1
    Riga numero 2
    Riga numero 3
    Riga numero 4
    Riga numero 5
    Riga numero 6
    Riga numero 7
    Riga numero 8
    Riga numero 9
    Riga numero 10
    Riga numero 11
    Riga numero 12
    Riga numero 13
    Riga numero 14
    Riga numero 15
    Riga numero 16
    Riga numero 17
    Riga numero 18
    Riga numero 19
    Riga numero 20
    16 : 9
    Damo UI — Memphis-inspired component library