Componente · M3
Catalog versionat
Fiecare intrare indică pachetul, versiunea, canalul, importurile publice și markup-ul canonic folosit și pentru previzualizare.
61 rezultate
Filtrele sunt păstrate în URL și pot fi distribuite.
Design tokens DTCG
Sursa canonică pentru primitive, roluri semantice și token-uri de componentă.
Teme funcționale
Patru teme oficiale și accente instituționale controlate.
Tipografie și layout
Scară fluidă, spațiere, containere, breakpoints și grid responsive.
Focus și motion
Focus vizibil în trei straturi și animații care respectă preferințele sistemului.
Label
Identifică explicit un control de formular și rămâne vizibil permanent.
Text ajutător
Oferă instrucțiuni înaintea completării fără a înlocui label-ul.
Fieldset
Grupează semantic controale care răspund aceleiași întrebări.
Legend
Numește un grup de controale și este primul element din fieldset.
Câmp text
Colectează o valoare scurtă folosind tipul HTML potrivit.
Zonă de text
Colectează text pe mai multe rânduri cu limită și instrucțiuni clare.
Listă de selecție
Permite alegerea unei valori dintr-o listă scurtă și stabilă.
Checkbox
Permite selectarea independentă a uneia sau mai multor opțiuni.
Radio
Permite alegerea unei singure opțiuni dintr-un grup exclusiv.
Mesaj de eroare
Explică problema unui câmp și modul concret de remediere.
Rezumatul erorilor
Listează erorile după validarea server-side și leagă fiecare mesaj de câmp.
Buton
Declanșează o acțiune și îi descrie consecința prin text.
Grup de butoane
Ordonează acțiunea principală și alternativele fără ambiguitate.
Încărcare fișier
Păstrează inputul nativ pentru selectarea unui fișier.
Control segmentat
Grup de radio-uri stilizat ca alegere exclusivă compactă, fără JavaScript.
Numărător de caractere
Numără caracterele rămase într-un câmp cu limită, actualizat live pentru cititoare de ecran.
Banner de autenticitate
Indică natura serviciului și domeniul oficial.
Alertă majoră
Comunică o situație critică la nivelul întregului serviciu.
Header instituțional
Prezintă identitatea instituției și numele serviciului.
Navigație desktop
Oferă acces la categoriile principale pe ecrane largi.
Navigație mobilă
Folosește disclosure nativ pentru navigația pe ecrane înguste.
Breadcrumb
Arată poziția paginii în ierarhie și permite revenirea la nivelurile anterioare.
Navigație locală
Navigație locală pentru paginile aceleiași secțiuni.
Căutare
Formular GET cu URL distribuibil pentru găsirea documentației.
Footer
Grupează resurse, guvernanță, licență și versiune.
Skip link
Permite utilizatorilor de tastatură să sară direct la conținut.
Banner de cookie-uri
Comunică folosirea cookie-urilor și persistă acordul; rămâne vizibil fără JavaScript.
Banner de fază
Semnalează stadiul serviciului (alfa/beta) și leagă la feedback.
Link înapoi sus
Revine la începutul paginii pe conținut lung; ancoră reală, nu doar scroll cu JavaScript.
Ieșire rapidă din pagină
Părăsește pagina imediat, prin înlocuirea intrării din istoric; link real fără JavaScript.
Link
Descrie destinația prin text și păstrează comportamentul nativ.
Link extern
Semnalează o destinație externă vizual și pentru tehnologii asistive.
Alertă
Comunică informații importante cu titlu, text și semnal non-cromatic.
Banner de notificare
Confirmă rezultatul unei acțiuni la începutul conținutului.
Text evidențiat
Evidențiază o notă fără a-i atribui o stare de sistem.
Card
Grupează conținut asociat și păstrează o acțiune principală neambiguă.
Etichetă de stare
Exprimă textual starea unui obiect, fără dependență de culoare.
Tabel responsive
Păstrează relațiile tabulare și mută overflow-ul într-o regiune locală.
Summary list
Prezintă relații cheie–valoare prin description list.
Details
Ascunde opțional informații suplimentare prin HTML nativ.
Paginare
Oferă URL-uri stabile și indică textual pagina curentă.
Metadate
Prezintă sursa, versiunea, licența sau alte atribute editoriale.
Ultima actualizare
Asociază o dată vizibilă cu valoarea tehnică din elementul time.
Spinner
Indică o operație în curs printr-o regiune live text, nu doar vizual.
Chip
Afișează o selecție sau un filtru activ, eliminabil printr-un link real.
Avatar
Reprezintă o identitate prin inițiale sau imagine, cu text alternativ.
Text de avertizare
Atrage atenția asupra unei consecințe importante, cu simbol non-cromatic.
Accordion
Grupează disclosure-uri native și poate păstra o singură secțiune deschisă.
Dialog
Afișează o suprafață modală nativă și restabilește focusul la închidere.
Tabs
Comută perspective paralele ale aceluiași obiect cu navigare prin săgeți.
Indicator de pași
Arată progresul unui flux prin listă ordonată și aria-current.
Introducerea datei
Colectează ziua, luna și anul separat sau folosește selectorul nativ.
Autocomplete
Adaugă listbox și navigare cu tastatura peste baseline-ul datalist.
Încărcare avansată de fișiere
Adaugă listă, eliminare și drag-and-drop peste inputul nativ.
Switch
Comută o stare binară imediată, fără buton de confirmare separat.
Tooltip
Explică pe scurt un termen sau control, vizibil la hover și la focus.
Dropdown
Ascunde acțiuni secundare într-un meniu declanșat de buton, cu fallback de listă vizibilă.
A fost utilă această pagină?
Linkul deschide un formular GitHub precompletat. Nu transmitem nimic până când alegi să publici feedback-ul și îți recomandăm să nu incluzi date personale.