Design System

MindMatch

Linee guida visive e componenti UI per l'app di matching terapeuta–paziente.

Progetto personale
UX/UI Design — Fabio Fatticcioni
Primary — usato per CTA principali e stati attivi
#FEE6DB
100 · tint
#FCC0A5
300 · light
#F97337
500 · base
#FA8855
600 · hover
#B35328
700 · pressed
#7C3A1C
900 · deep
Secondary & Ink — supporto e testo
#FFE3C7
peach · hover
#FFCC99
peach · base
#D1A77D
peach · pressed
#A0A8B0
ink · 300
#2C3E50
ink · base
#212E3C
ink · deep
Neutrali — sfondi e superfici
#F7F2F0
background
#FDFDFD
surface / card
#CACFD3
border / divider
#B9BEC4
disabled
Trova il terapeuta giusto
Poppins SemiBold / 32px
Trova il terapeuta giusto
Poppins SemiBold / 22px
Trova il terapeuta giusto
Poppins SemiBold / 18px
Un percorso guidato per scegliere con fiducia.
Roboto Regular / 14px
Un percorso guidato per scegliere con fiducia.
Roboto Regular / 12px
Disponibile da lunedì a venerdì
Roboto Light / 12px · caption

Le due famiglie restano nettamente distinte per peso e forma: Poppins arrotondata e piena per i momenti decisionali, Roboto neutra per tutto ciò che va letto con calma — profili, curriculum, messaggi.

Default
Hover
Pressed
Disabled
Primary
Prenota
Prenota
Prenota
Prenota
Secondary
Riprogramma
Riprogramma
Riprogramma
Riprogramma
Tertiary
Annulla
Annulla
Annulla
Annulla
Radio button
Selezionato
Non selezionato
Orario disponibile
09:00
11:30
14:00
Specializzazione
Ansia
Stress
Percorsi lunghi
Preferito
Rating & prezzo
4.9 (128 recensioni)
75$ / sessione
Metodo di pagamento
Google Pay
Carta •••• 2391
S.C.
Sara Conti
Psicologa clinica
M.R.
Marco Rinaldi
Psicoterapeuta · 7 anni di esperienza
Ansia
Gestione stress
4.8
Disponibile mar · gio
80$ / sessione
Prenota sessione
Ciao! Ho notato che stai valutando un nuovo percorso, come posso aiutarti?
Non l'ho mai fatto prima, sono un po' nervoso.
È completamente normale. Possiamo iniziare con calma, un passo alla volta.
Spacing
4px
8px
12px
16px
24px
32px
48px
Radius
8px · input
12px · componenti piccoli
20px · card
pill · bottoni, tag, nav