Sistemi di design,
Pronti per il tuo agente AI.

Un riferimento pratico per le interfacce di prodotto: colori personalizzabili con temi, scala tipografica e di spaziatura a nove livelli, stati dei componenti e una guida completa per agenti AI.

Crea una composizione pratica per il controllo delle quantità usando l’unità magica da 16px di Mozaic, controlli coordinati da 48px, import SCSS reali e classi BEM. Il pianificatore di scaffali rende visibili i limiti, gli errori tipizzati e un riepilogo locale dei materiali.

Esamina Spectrum v3 di React tramite una tabella selezionabile di risorse creative e un pannello di controllo delle preimpostazioni di esportazione. Scopri i temi Provider e la scala degli input, le proprietà di stile supportate, le raccolte con chiave e le differenze tra la v3 e la più recente implementazione Spectrum 2.

Crea flussi di servizio più articolati con gli spaziature concrete, le proprietà responsive e il modello di stato TaskList di AgDS. Prova un flusso di preparazione in cui il passaggio di revisione si sblocca solo una volta completati i prerequisiti.

Esplora il tema Alaska di Auro con token semantici reali per colori e tipografia, tipografia basata su classi e il componente nativo per i voli. Due voli originali dimostrano il filtraggio e la selezione locali, senza rappresentare la disponibilità di una compagnia aerea né consentire prenotazioni.

Usa i componenti web nativi e i token di design pubblicati di Alberta per creare una lista di preparazione completa, con opzioni accessibili, avanzamento derivato e feedback di revisione trasparente.

Usa il contratto reale e open source di Switch di Amsterdam, con un tema neutro completo, etichette accessibili e preferenze di lettura applicate immediatamente.

Crea un selettore delle sezioni di un report con il componente Transfer controllato di Arco. Esplora le scale effettive di spaziatura e dimensioni, le convenzioni delle variabili CSS, le superfici semantiche e la differenza tra selezionare e spostare le righe.

Ariakit fornisce componenti React senza stili, con stato condiviso esplicito e parti accessibili componibili. Il suo combobox distingue il testo digitato dalla selezione confermata, risultando utile per i selettori basati sulla ricerca; il cercatore di riferimenti qui sotto illustra questa distinzione con risultati raggruppati e non disponibili.

Crea una bacheca per la pianificazione delle issue con i token semantici Atlassian, una scala di spaziatura a intervalli di otto pixel, le API reali di Button, Lozenge e Toggle e la configurazione di stile Compiled richiesta. Esamina un’issue, filtra la bacheca e sposta un elemento di lavoro locale senza confondere la selezione con lo stato.

Una guida alla configurazione di Cloudscape con token reali per l’aggiornamento visivo, spaziatura adattata alla densità, API controllate per i moduli e una procedura guidata funzionante in due passaggi per le risorse.

Crea un flusso di revisione bancaria personalizzato con i moduli Angular di Backbase, l’esportazione semantica del tema e stati di revisione espliciti. Confronta le API web con le dimensioni native documentate separatamente.

Bits UI offre componenti Svelte headless, componibili tramite parti native e lo stato di Svelte 5. L’esempio combina una casella di controllo con stato misto derivato, sezioni dell’accordion espandibili in modo indipendente e una finestra di dialogo di revisione basata su portal, includendo la configurazione completa degli stili.

Usa Bootstrap 5.3.8 tramite le scale effettive di spaziatura, i colori semantici, la griglia responsive e le API dei componenti. Prova un modulo di prenotazione funzionante, un riepilogo degli errori, un filtro per tabella, una finestra modale e un selettore della modalità colore, poi riutilizza il codice documentato.

Crea un modulo per le preferenze dei promemoria nello stile di B.C., con token semantici reali, controlli React Aria nativi, campi di contatto condizionali e comportamento completo di convalida.

Crea una scrivania editoriale con la struttura reale di campi e controlli di Bulma, colonne responsive, modificatori semantici per i colori e variabili CSS, con codice di convalida completo.

Esplora la tipografia, i token semantici e i componenti web nativi di GC Design System con una guida completa e consultabile per la preparazione, dotata di sezioni a scomparsa e gestione degli stati vuoti.

Realizza la griglia editoriale, la tipografia attuale e i componenti Expandables nativi di CFPB con un foglio di lavoro di lettura funzionante, API dei pacchetti verificate e confini d’identità espliciti.

Un riferimento a Chakra UI v3 per token, ruoli semantici dei colori, ricette e componenti composti per i moduli. Esamina le scale effettive di spaziatura e tipografia, poi prova un modulo nativo per il profilo dell’area di lavoro con convalida, simulazione del salvataggio non riuscito e aspetto chiaro o scuro.

Implementa CMS Core con variabili del tema versionate, API reali del componente Review e un flusso funzionante di modifica e revisione che conserva le risposte dell’utente e il focus.

Una coda di revisione CoreUI realizzata con le variabili reali del tema 5.9, schede native, selezione multipla tramite caselle di controllo e un toast persistente che consente di annullare l’ultima archiviazione locale.

Uno strumento nativo per CSS dedicato alla creazione di inviti, che mostra i 5 temi semantici di daisyUI, i colori coordinati per i contenuti, gruppi di pulsanti radio, controlli a intervallo, convalida del browser e un vero passaggio di revisione in una finestra di dialogo.

Crea una ricerca circoscritta dei dispositivi con DDS v3: colori semantici, scala tipografica responsive, spaziatura basata sui token e una composizione InputGroup il cui filtraggio è gestito dall’applicazione.

Esplora il tema DKFDS della Danimarca, le scale Sass effettive e i pattern accessibili per le tabelle con un confronto completo delle risorse, che include ordinamento numerico, ricerca inviata e recupero dallo stato vuoto.

Implementa una sequenza di servizio leggibile con la tipografia reale di Bootstrap Italia, la struttura responsive di Stepper e uno stato locale del modulo ripristinabile.

Esplora i ruoli effettivi del tema di Designsystemet, le modalità di dimensionamento e il comportamento nativo dei campi con un editor completo per le descrizioni delle attività, dotato di feedback sul numero di caratteri e di stato di presentazione conservato.

Esamina la tipografia, la griglia e l’accordion concreti del sistema dello Stato francese API nel suo contesto istituzionale. Confronta il comportamento dei pannelli informativi collegati e indipendenti in un esempio didattico chiaramente neutrale.

Esamina le scale cromatiche e di spaziatura di LocalTapiola di Duet attraverso un flusso di selezione di un intervallo di date, con valori ISO, convalida esplicita dell’intervallo, metodi di gestione del focus dei componenti e un confine distinto per il selettore open source.

Crea un esploratore di log Elastic UI con le scale Borealis verificate, controlli nativi per tabelle e ricerca, filtri per gravità, eventi salvati in locale e codice sorgente React completo.

Usa il modello Transfer, i filtri e le opzioni disabilitate effettivi di Element Plus per creare un ambiente di lavoro per la selezione dei moduli, con colori, dimensioni tipografiche e dimensioni dei controlli verificati.

Esamina il contratto delle tabelle dati di Soul insieme alla spaziatura di sei pixel, ai ruoli cromatici su più livelli e alla tipografia Inter compatta. Confronta la selezione multipla, la notazione dei dati mancanti e le righe di riepilogo, quindi consulta i punti di accesso verificati del pacchetto privato React.

Una guida pratica a Calcite per strumenti spaziali progettati per un uso mirato: superfici semantiche e azioni blu, pannelli di ispezione compatti, API reali per gli input e un esempio completo, eseguibile in locale, per la revisione di un sito.

Esamina i ruoli cromatici, tipografici e di spaziatura EC di Europa attraverso un brief completo con accordion nativo, inclusi l’uso da tastiera, l’apertura di tutti i pannelli e un’alternativa leggibile senza JavaScript.

Una composizione nativa con accordion e drawer di Flowbite 4, con alias verificati per i temi semantici, una checklist di preparazione persistente e un flusso accessibile, eseguibile in locale, per annotare i materiali.

Uno scaffale di lettura nativo Fomantic UI con valori del tema compilati e verificati, moduli jQuery per menu a discesa e valutazioni, supporto esplicito alla tastiera e una selezione breve persistente in locale.

Un banco di verifica Foundation funzionante con XY Grid, validatori personalizzati Abide, conferma Reveal, impostazioni Sass effettive e codice completo per l’integrazione locale.

Uno sketchbook nativo Framework7 con azioni swipeout reali, valori espliciti del tema iOS, un’apertura delle azioni accessibile da tastiera e un elenco filtrato che mantiene gli studi completati fino al ripristino.

Una guida Pajamas per i flussi di lavoro tecnici: token semantici effettivi, tipografia e spaziatura fluide, un ispettore di pipeline a fasi, messaggi di errore leggibili e una simulazione esplicitamente locale dei nuovi tentativi.

Crea una checklist per un kit da campo con i creatori core Button e Input effettivi di gluestack, i colori semantici v5 espliciti e il codice sorgente completo per React Native Web. Esamina la convalida, le azioni da tastiera, l’identità stabile degli elementi e l’avanzamento della preparazione calcolato localmente.

Esplora i ruoli cromatici reali, gli slot delle schede e la paginazione nativa di Gov Design System CE attraverso un toolkit di lettura completo con sei risorse e gestione esplicita del focus e dello stato della pagina.

Crea un percorso GOV.UK di domande e verifica delle risposte con la scala tipografica v6 corrente, spaziatura responsiva, colori funzionali, convalida collegata e un’integrazione Frontend concreta.

Scopri HarvardSites come piattaforma editoriale: confronta gli stili dei siti, scegli abbinamenti di font documentati e componi pagine universitarie con componenti di contenuto progettati per lo scopo.

Headless UI offre componenti di interazione senza stile per React, destinati a finestre di dialogo, listbox e interruttori. Questa guida si concentra sulla composizione del comportamento nativo di focus, selezione e popup con CSS ordinario, usando come esempio pratico un flusso di condivisione dei documenti.

Componi gruppi di selezione HDS nativi, colori semantici per i messaggi e riepiloghi degli errori collegati in un flusso completo, eseguibile in locale, di revisione e correzione.

Una guida di riferimento per HeroUI v3 con variabili CSS semantiche effettive, controlli composti React, superfici chiare e scure e una procedura funzionante per esportare immagini.

Modella una prenotazione di capacità con le primitive di layout, i campi modulo controllati e gli indicatori numerici di Grommet. Usa con criterio la scala del tema e mantieni distinto il tema base di Grommet dal tema HPE installato separatamente.

Crea pagine universitarie con la scala effettiva dei token di Rivet, l’anatomia dei componenti HTML e le interazioni native da tastiera. Esplora una pagina compatta con i dettagli di un workshop e schede accessibili per le informazioni sulle visite.

Componi un modulo aziendale di manutenzione con gli stati effettivi degli input IDS, gli alias del tema e un identificativo preciso dell’asset. Esamina i token pubblici correnti del tema, un pacchetto Web Components con versione bloccata e un flusso locale per le bozze con convalida e ripristino.

Un’interfaccia nativa Ionic per le preferenze di lettura, con ruoli cromatici verificati, geometrie degli intervalli per iOS e Material, comportamento effettivo di segmenti e interruttori e un articolo che si adatta alle scelte di font, dimensione e sfondo.

Crea interfacce leggibili per i servizi pubblici giapponesi con i ruoli testuali DADS, token semantici e anatomia nativa dei componenti HTML. Prova una ricerca di ricevute funzionante con errori di formato, un risultato senza corrispondenze e un record di stato consultabile.

Crea un pannello di condivisione per creator con informazioni chiare sul corso, azioni di copia immediate e riscontri affidabili sugli appunti. Esplora l’anatomia dei componenti Rails di Sage, le specifiche tipografiche pubblicate e il più recente livello di token Pine caricato esternamente.

Crea un’interfaccia nativa KERN con tipografia verificata, temi semantici, pannelli informativi e un flusso di conferma reversibile.

Una guida Orbit dedicata ai viaggi, con colori e spaziature effettivi del prodotto, opzioni native per i bagagli, un riepilogo dei prezzi coerente e un flusso completo di revisione locale.

Kobalte offre componenti headless per Solid, inclusi campi numerici con valori grezzi e formattati separati, l’anatomia composta delle checkbox e pulsanti con stato premuto. Questa guida collega le primitive ai segnali Solid attraverso uno scaler di ricette con quantità derivate e caselle degli ingredienti ripristinabili.

Esamina il linguaggio delle interfacce operative di Maersk attraverso i ruoli del tema chiaro, le scale per titoli e testo, i raggi annidati e la gestione degli identificativi. Un esempio di ricerca delle spedizioni mostra la corrispondenza esatta dei riferimenti e una cronologia degli eventi accessibile, senza dichiarare l’accesso ai dati logistici in tempo reale.

Una guida di riferimento per Mantine 9, basata su una tabella nativa dei partecipanti e un drawer per la pianificazione. Esamina le scale effettive del tema, collega useForm a TextInput, Select, Checkbox e DatePickerInput e prova la convalida prima di aggiungere un record locale.

I builder di store e azioni di Melt UI aggiungono comportamenti accessibili al markup Svelte che gestisci direttamente. Questa guida usa @melt-ui/svelte 0.86.6 per collegare i builder radio, slider e switch tramite attributi, azioni e store scrivibili; è distinto dal più recente API basato sulle runes.

Scopri i flussi di lavoro WordPress supportati da Forty-Two, la palette web e gli schemi delle directory del personale attraverso un esempio funzionante di filtro per ruolo e ricerca.

Crea uno spazio di lavoro Fluent UI React v9 con token semantici effettivi, le scale web di tipografia e spaziatura, schede controllate e una finestra di dialogo per l’accesso con convalida. Confronta i valori del tema, esamina l’anatomia dei componenti e prova un’interazione locale prima di usare l’esempio completo React.

Componi una bacheca di consegna funzionante con i token Vibe 4 e i controlli React. Scopri la differenza tra i colori semantici delle azioni e le etichette della bacheca, le spaziature nominali, le scorciatoie tipografiche e la configurazione esplicita di CSS necessaria per una nuova applicazione.

Crea un’interfaccia di ricerca in cui i numeri siano allineati, i colori degli asset mantengano il loro significato e la tipografia resti leggibile. Esplora le costanti MDS, l’adozione di Vue 3, la transizione a Morningstar Intrinsic e un quaderno fittizio di allocazione ordinabile.

Una guida editoriale Protocol con stack di font reali, scale di spaziatura e larghezza dei contenitori, una pagina di lettura illustrata e responsiva e un esempio completo di modulo nativo CSS.

Un ambiente di lavoro nativo con tabella dati Naive UI, valori degli oggetti tema verificati, selezione ed espansione delle righe, ordinamento, paginazione e un’azione locale per la revisione in blocco.

Usa i token ax effettivi di Aksel v8, la densità nativa della tabella e la struttura semantica dell’intestazione. Ordina e seleziona record fittizi di follow-up, confrontando i temi chiari e scuri.

Usa la tipografia NHS.UK, spaziature responsive, opzioni radio raggruppate e dettagli contestuali per creare un percorso chiaro di scelta delle preferenze per un appuntamento.

Componi un’interfaccia per i servizi pubblici usando componenti reali dei contributori e un tema esplicito. Questo riferimento usa Utrecht CSS per illustrare la mappatura dei token, la struttura di un elenco di dati e due temi originali con lo stesso flusso di modifica.

Esamina i token del tema Therapy di Nord e i contratti dei Web Component attraverso una bozza di richiesta per una sala: ruoli cromatici reali, dimensionamento responsive dei campi, convalida esplicita e risultati preparati localmente.

Esplora i token di design NSW, la tipografia Public Sans e le schede native accessibili da tastiera attraverso una guida completa al workshop con un elenco di letture locale e indipendente.

Crea un compositore di brief completo con Nuxt UI 4.11.3, usando componenti Vue reali, riferimenti semantici ai temi, convalida degli input e un comportamento esplicito per le bozze locali.

Crea una risposta al sondaggio che non possa contraddirsi: caselle di controllo native ONS, risposte mutuamente esclusive, riferimenti precisi a tipi e colori e un flusso completo di revisione locale.

Crea una guida articolata in più sezioni in stile Ontario, con tipografia, spaziature e valori cromatici pubblicati, comportamento nativo dell’accordion e codice sorgente completo e corrispondente alla versione.

Esamina la palette effettiva, i ruoli semantici, le spaziature e i limiti di densità di Oracle JET 19 Redwood attraverso un foglio di lavoro originale, completo e modificabile per la revisione delle scorte.

Esamina i token semantici effettivi, i pacchetti tema e il comportamento nativo di Offcanvas di Orange OUDS 1.4 attraverso uno studio comparativo completo e responsive.

Un editor di catalogo nativo Oruga con tag di argomenti ricercabili e rimovibili, limiti lessicali applicati, token effettivi di un tema opzionale e una scheda dal vivo che riflette le etichette selezionate.

Crea un’area di lavoro dati ad alta densità con Blueprint: token verificati per tipografia e intenti, tabella dati selezionabile, pannello di revisione e codice sorgente completo in React.

Esplora il sistema di contenuti di Bolt con marchio Pega: tipografia fluida, spaziature orizzontali e verticali separate e composizione di un accordion Twig per una pagina editoriale di risorse.

Gli stili di Pico CSS applicano colori semantici tramite HTML, con una scala tipografica responsive basata su rem e variabili tema. Le distribuzioni standard, senza classi e condizionali hanno ambiti d’integrazione diversi; questa guida usa la build standard per un modulo sulle preferenze di lettura, con comportamenti nativi di disclosure e dialogo.

Esamina la griglia a 3 di Bootstrap, i colori semantici delle azioni e i pannelli dei servizi interamente cliccabili di Poncho attraverso un catalogo di attività funzionante.

Esplora Porsche Design System v4 con spaziature fluide, schemi cromatici CSS, tipografia Porsche Next e un configuratore a due opzioni. Il riferimento include espressioni reali dei token e un entry point Vite completo che usa gli eventi attuali di segmented-control.

Un pianificatore di sessioni nativo Preline con schede collegate, un plugin input-number con limiti, alias del tema installati, scale Tailwind reali e una stima locale dei materiali che si aggiorna in base alla sessione selezionata.

Un’implementazione PrimeVue con versione vincolata dell’ecosistema Prime UI: un albero di documenti con tema Aura, riferimenti reali al preset, espansione controllata, filtri, selezione e aggiunta locale ai preferiti.

Pure CSS è un foglio di stile modulare per griglie, moduli, pulsanti, menu e tabelle, senza un runtime per i widget. Questa guida mostra come il modulo opzionale per la griglia responsive si integra con gli elementi semantici nativi in un catalogo di attrezzature filtrabile, con ordinamento e selezione implementati esplicitamente.

Un flusso guidato nativo Quasar con valori reali di marchio e spaziatura, convalida QForm, un creatore di brief in tre passaggi, opzioni radio per il formato e un’agenda dal vivo di quarantacinque minuti.

Esplora l’implementazione Bootstrap del Queensland attraverso un selettore di risorse illustrato e completo, con ruoli tema reali, stile nativo delle caselle di controllo e un dialogo di revisione accessibile.

Crea un compositore completo di piani di concentrazione con React Native Elements 5.0.0: ruoli tema reali, input e selezioni controllati, convalida, conferma locale e build web verificata.

Un calendario di revisione nativo React Suite con variabili CSS v6 verificate, indicatori nelle celle delle date, agenda del giorno selezionato, convalida modale e regole esplicite per la pianificazione locale.

Usa PatternFly per un’area di lavoro operativa: riferimenti semantici ai token, schede di servizio selezionabili, selezione multipla a tre stati, revisione dell’ambito e codice nativo completo in React.

Crea un selettore concreto per l’evasione degli ordini Cedar con riquadri Vue nativi, valori reali dei token, navigazione completa da tastiera e composizione responsive dei prodotti.

Esplora i ruoli cromatici effettivi di Ripple, la scala di spaziatura a 14 livelli e i riferimenti tipografici responsive attraverso una timeline completa per un workshop, con visualizzazione progressiva, indicatore di avanzamento e focus da tastiera sul passaggio successivo.

Applica le linee guida pubbliche di design di Sainsbury a un flusso completo di scelta di una fascia oraria per il ritiro: riferimenti reali a palette e dimensioni, opzioni radio accessibili, riepilogo aggiornato e riscontro locale trasparente.

Una guida Lightning per attività con record ad alta densità: spaziature, tipografia e colori semantici reali, un’area di lavoro modificabile per i casi, convalida dei campi e cronologia delle attività che riflette le modifiche locali.

Esamina la struttura di visualizzazione e interazione di One UI, le indicazioni sui margini di 24dp e il requisito di ridimensionamento del testo al 200% attraverso un’anteprima originale e completa delle preferenze di lettura, con aspetto scuro e ripristino esplicito.

Usa il tema Horizon di SAP Fiori tramite UI5 Web Components: parametri tema reali, densità dei contenuti esplicita, stati semantici dei valori e composizione di una richiesta d’acquisto con convalida locale.

Applica la tipografia responsive, le spaziature e i ruoli cromatici del governo scozzese a un campo nativo con conteggio dei caratteri, che conserva il testo oltre il limite e consente di correggerlo.

Scopri Braid attraverso una composizione originale per la ricerca di lavoro: variabili circoscritte al tema, quattro breakpoint reali, testo contestuale, tonalità distinte per i pulsanti e un campo controllato che spiega la convalida invece di disattivare l’azione.

Un riferimento Evergreen con valori tema reali, inserimento controllato di tag, corrispondenza delle regole in tempo reale, un percorso di recupero per lo stato vuoto e un dialogo nativo di revisione.

Crea una configurazione sequenziale dell’area di lavoro con i componenti Steps di base consigliati da Semi, Input e Switch controllati, token tema reali e una scelta esplicita del pacchetto React 18 o React 19.

Una guida Intergalactic con token semantici e per grafici aggiornati, controlli nativi per i filtri, confronto a scala fissa, dettagli dell’elemento selezionato e un fixture completo e riproducibile.

Esplora i riferimenti esatti a spaziature, raggi e tipografia di Horizon Workspace attraverso un flusso completo di revisione delle richieste locali, con conservazione delle bozze, convalida, filtri di stato e recupero.

Rendi concreto Anvil2 con il suo modello di token a tre livelli, valori dei ruoli verificati per temi chiari e scuri e un’interazione completa per l’assegnazione dei servizi, con stati sincronizzati di tecnico, orario e revisione.

Esamina gli eventi industriali con un vocabolario esplicito dei livelli di gravità, ruoli cromatici adattati al tema e iX Event List API. Questa guida crea un registro locale delle attrezzature senza confondere un record revisionato con un allarme macchina risolto.

Usa gli attuali Web Components di SGDS con token responsive reali, temi giorno e notte e quantità native con limiti, per mantenere sincronizzato un piano locale.

Confronta i temi Cerberus, Mint e Rose reali di Skeleton 5.0.1 attraverso una postazione di lettura completa, con ispezione dei token in tempo reale, combinazioni di superfici scure e stato locale reversibile.

Esamina i token effettivi di Seeds per colori, spaziatura, tipografia di prodotto e bordi attraverso una coda editoriale completa, con selezione multipla, stati vuoti dopo il filtraggio e annullamento.

Componi pagine editoriali accademiche con il preset Tailwind di Decanter, la scala tipografica responsive e margini fluidi. Esplora schede di eventi originali con filtri tematici funzionanti e abstract espandibili.

Una guida Circuit con token semantici esatti, proprietà di convalida native, un editor completo degli articoli del venditore e un’anteprima illustrata dal lato cliente.

Crea moduli chiari per i servizi pubblici finlandesi con Source Sans 3, token di spaziatura espliciti e un modello recuperabile di selezione dei documenti.

Un diario di progetto Tabler nativo con variabili del tema 1.6 effettive, schede cronologiche, contesto di datagrid, convalida nelle finestre modali e una composizione chiara/scura che consente di aggiungere checkpoint locali.

Esplora le categorie effettive dei token v5 di Tamagui e i temi blu chiaro/scuro attraverso una bacheca completa delle abitudini con componenti nativi, convalida, progressi e recupero dallo stato vuoto.

Crea un editor compatto di criteri API con TDesign React: ruoli concreti del tema, scala delle dimensioni di due pixel, registrazione dei campi Form e composizione tipizzata di Table.

Crea un’interfaccia per scoprire servizi con le primitive v2 documentate di Thumbprint: schede compatte dei fornitori, dettagli di confronto leggibili, stati di selezione chiari e una selezione ristretta sempre visibile.

Componi una bozza di notifica con il tema e le convenzioni dei pulsanti di Paste, una scala di spaziatura verificata e una distinzione chiara tra la modifica, la revisione e l’invio effettivo di un messaggio.

UIkit combina un framework CSS, la personalizzazione Less e componenti JavaScript basati su attributi. Lo Switcher, l’Accordion e la griglia responsive collaborano nel pianificatore di workshop qui sotto, mostrando dove termina il comportamento nativo dei componenti e dove inizia lo stato di selezione dell’applicazione.

Esplora i token pubblicati di colore e spaziatura di UNDP, le schede native controllabili da tastiera e un esempio completo di lettura e workshop con progressi di revisione locali.

Combina i token di spaziatura di USWDS, i ruoli del tema, le tabelle semantiche e gli accordion nativi in un confronto di opportunità consultabile.

Crea percorsi di servizio chiari con i token semantici e il Process List nativo di VA: spiegazioni visibili delle fasi, etichette di stato significative e dettagli supplementari che mantengono leggibile il percorso principale.

Un flusso mobile di selezione dell’indirizzo realizzato con Vant 4: variabili CSS reali, identità dell’indirizzo controllata, convalida dei campi, cambio di tema e salvataggio esplicitamente limitato al dispositivo.

Usa Nova CSS di Visa per creare una preferenza chiara nel formato dell’estratto conto, con controlli radio nativi, intestazione di colore alternativo e riepilogo di revisione. Esamina i valori esatti del tema 1.6.5, la spaziatura scalabile e l’integrazione completa del foglio di stile.

Esamina le fondamenta web di Volvo Cars, basate innanzitutto su HTML, i token effettivi della modalità chiara e lo stile nativo delle schede selezionabili attraverso un esempio completo di piano per fare i bagagli, con scelte indipendenti, cambio di tema e ripristino.

Un foglio di valutazione nativo Vuestic con preset chiari e scuri verificati sulle fonti, etichette di valutazione accessibili, convalida delle aree di testo, media calcolata e uno stato salvato che conserva la valutazione completata.

Crea interfacce di lettura flessibili con tipografia fluida, ruoli semantici dei colori e contenuti comprimibili nativi, sempre leggibili anche senza JavaScript.

Esamina i token semantici effettivi di Web Awesome nei suoi elementi personalizzati nativi, comprese le modifiche circoscritte di raggio e spaziatura, lo stile dello shadow DOM, il comportamento di select e la convalida degli input.

Usa la struttura effettiva di SearchInput di Codex, la gerarchia delle azioni e i token pensati per la lettura. Cerca in un indice locale di articoli, esamina un risultato e torna alla stessa posizione di lettura.

Usa i ruoli reali del tema e la sintassi dei token di Wanda in un’area di lavoro completa per leggere i feedback, con filtri tematici, contesto delle evidenze espandibile e un taccuino locale persistente.

Crea un piano di apprendimento locale con FormField composto, TextInput controllato e PrimaryButton di Canvas Kit, distinguendo le fonti attuali dei token semantici dai vecchi esempi di migrazione a space.x4.

Una guida Garden per l’assistenza, con alias reali del tema, scale tipografiche e dei raggi, un compositore di risposte completo, bozze locali gestite in base alla visibilità e recupero dei campi.

Marketplace di viaggi. Accento corallo caldo, fotografia protagonista, interfaccia arrotondata.

Gestione dei progetti. Estremamente minimalista e precisa, con accento viola.

Sistema essenziale, quasi monocromatico, caratterizzato da un profondo nero-verde petrolio, ampi spazi bianchi e tipografia editoriale.

Elettronica di consumo. Ampi spazi bianchi di qualità, SF Pro, immagini cinematografiche.

Infrastruttura di pagamento. Eleganti sfumature viola distintive, con peso tipografico 300.

Servizi bancari digitali. Interfaccia scura ed elegante, schede sfumate, precisione fintech.

Effetto vetro satinato con livelli traslucidi, sfocatura discreta e bordi luminosi, per profondità ed eleganza contemporanea.

Trasferimento di denaro. Accento verde brillante, stile cordiale e chiaro.

Automobilismo elettrico. Sottrazione radicale, fotografie a tutto schermo, interfaccia ridotta al minimo.

Piattaforma per l’apprendimento delle lingue. Verde brillante, ombre marcate e divertimento in stile gioco.

Piattaforma orientata al codice. Densità funzionale, precisione del blu su bianco, fondamenta Primer.

Interfaccia conversazionale incentrata sull’IA, con controlli essenziali, risultati chiari e flussi di lavoro delegati agli agenti IA.

Ibrido tra foglio di calcolo e database. Estetica dei dati strutturati, colorata e accogliente.

Design system strutturato, pensato per le aziende, che privilegia chiarezza, coerenza ed efficienza nelle applicazioni web con grandi quantità di dati.

Dashboard applicativa dall’estetica viola, con navigazione nella barra superiore, layout a schede e flussi di lavoro pensati prima di tutto per gli sviluppatori.

«Il browser che naviga al posto tuo». Superfici traslucide, sfumature calde e layout incentrato sulla barra laterale.

Stile espressivo ad alto contrasto, con tipografia creativa e colori audaci per interfacce di grande impatto visivo.

Un sistema visivo da rivista, costruito come un collage: fondo color carta calda, immagini surreali di gesso e architettura, caratteri di grande formato, filetti sottili, sezioni numerate con numeri romani e piccole annotazioni editoriali. Ispirato alla qualità produttiva delle riviste cartacee di fascia alta (Monocle, Apartamento, IDEA), reinterpretata per un sito web funzionante.

Layout a griglia modulare con blocchi a scheda, gerarchia chiara, spaziatura morbida e contrasti visivi discreti per interfacce ordinate e facili da consultare.

Exchange di criptovalute. Accento giallo deciso su fondo monocromatico, con l’urgenza di una sala di trading.

Automobilismo di lusso. Superfici scure e raffinate, estetica di precisione ingegneristica tedesca.

Sottomarca dedicata alle prestazioni motoristiche. Superfici da abitacolo quasi nere, accenti tricolori BMW M e geometrie ingegneristiche affilate.

Forte impatto visivo, con tipografia massiccia, colori ad alto contrasto e layout decisi.

Estetica grezza e antidesign, ispirata all’architettura in cemento, con elementi spogli, layout spiazzanti e minimalismo funzionale.

Marchio di hypercar. Fondo nero cinematografico, austerità monocromatica e caratteri monumentali.

Interfaccia accogliente ispirata ai caffè, con tonalità calde, tipografia morbida e layout puliti per un'esperienza di navigazione rilassata.

Pianificazione open source. Interfaccia pulita e neutra, semplicità pensata per gli sviluppatori.

Piattaforma per la creazione visiva. Gradiente viola-blu vivido, spazi ampi, forme geometriche accoglienti.

Assistente IA di Anthropic. Accento terracotta caldo, layout editoriale pulito.

Agenzia creativa. Forme organiche, gradienti morbidi, layout curato artisticamente.

Forme morbide, arrotondate e simili al 3D, che imitano l'argilla modellabile, con elementi giocosi e gonfi e superfici colorate.

Design incentrato sulla semplicità, con ampi spazi vuoti, tipografia leggibile e una palette di colori limitata per ridurre il disordine visivo.

Database di analisi ad alte prestazioni. Stile di documentazione tecnica con accenti gialli.

Piattaforma IA aziendale. Gradienti vivaci, estetica da dashboard ricca di dati.

Exchange di criptovalute. Identità blu pulita, incentrata sulla fiducia, dall'aspetto istituzionale.

Palette vivaci e ad alto contrasto e gradienti per esperienze utente coinvolgenti, memorabili e moderne.

Piattaforma di integrazione di strumenti. Stile scuro moderno con icone colorate per le integrazioni.

Minimalismo contemporaneo con griglie bento, supporto alla modalità scura e layout accessibili ad alte prestazioni.

Design professionale e coerente con il marchio, con griglie strutturate, layout minimalisti e schemi aziendali uniformi.

Estetica futuristica fantascientifica, con temi scuri, vivaci accenti neon ed elementi spaziali immersivi.

Design giocoso e ricco di personalità, con tipografia espressiva e grafiche audaci per landing page e progetti creativi.

Editor di codice progettato innanzitutto per l'IA. Interfaccia scura ed elegante, accenti sfumati.

Estetica da piattaforma cloud con tema scuro, griglie modulari, pannelli effetto vetro e una gerarchia dei dati ben definita per dashboard di produttività.

Piattaforma vocale e di chat. Blu violaceo intenso, superfici pensate innanzitutto per il tema scuro, tocchi di colore giocosi.

Tecnica di rendering a pattern di punti che simula le sfumature con una palette limitata, per effetti nostalgici, rétro e ad alto contrasto.

Stile disegnato a mano, simile a uno schizzo, con scarabocchi, caratteri manoscritti e linee imperfette per un'atmosfera giocosa e informale.

Design teatrale ad alto contrasto, con layout audaci, immagini immersive e composizioni insolite che catturano l'attenzione.

Layout editoriale ispirato alle riviste, con raffinata tipografia serif, griglie strutturate e un'esperienza di lettura elegante.

Estetica aggraziata e raffinata, con tipografia delicata, palette essenziali e layout curati che trasmettono sofisticatezza.

Piattaforma vocale IA. Interfaccia scura e cinematografica, estetica ispirata alle forme d'onda audio.

Stile dinamico e vivace, con bordi spessi, forme geometriche, colori ad alto contrasto e tipografia espressiva che comunica movimento e vitalità.

Design aziendale pulito e ad alto contrasto per flussi di lavoro basati sui dati, con intuitive interazioni di trascinamento e layout strutturati.

Piattaforma nativa React. Tema scuro, spaziatura tra lettere ridotta, attenzione al codice.

Design vivace e ricco di personalità, con colori audaci, grafiche giocose e layout dinamici che bilanciano creatività e struttura.

Estetica fantasy ispirata ai videogiochi, con immagini audaci e di pregio, palette ricche ed elementi tematici immersivi.

Marchio automobilistico di lusso. Chiaroscuro editoriale, accenti Ferrari Red, nero cinematografico.

Strumento di progettazione collaborativa. Molti colori vivaci, stile giocoso ma professionale.

Stile minimalista bidimensionale, con colori vivaci, tipografia pulita e senza effetti 3D, per interfacce rapide e facili da usare.

Creatore di siti web. Nero e blu audaci, animazioni al centro dell'esperienza, attenzione al design.

Design intuitivo e accessibile, con elementi arrotondati, ampi spazi vuoti e palette di colori pastello tenui.

Design orientato al futuro, con tipografia ispirata alla tecnologia, layout moderni ed estetica elegante, votata all'innovazione.

Transizioni cromatiche fluide e superfici ricche di gradienti per interfacce moderne e giocose, dotate di profondità visiva.

Automazione dell'infrastruttura. Stile aziendale essenziale, in bianco e nero.

Hub della community di machine learning. Accento giallo solare, identità monospace, stile allegro e denso.

Tecnologia aziendale. Sistema di design Carbon, palette blu strutturata.

Messaggistica per i clienti. Palette blu accogliente, schemi di interfaccia conversazionali.

Sistema editoriale ispirato alla carta: fondo color pergamena calda, accenti blu inchiostro, gerarchia guidata dai caratteri serif. Pensato per curriculum, documenti di una pagina, white paper, portfolio, presentazioni e tutto ciò che deve sembrare stampato su carta di alta qualità anziché un'interfaccia. Multilingue per progettazione (EN · zh-CN · ja).

Trading di criptovalute. Interfaccia scura con accenti viola, dashboard dense di dati.

Marchio di supercar. Superfici nero assoluto, accenti dorati, tipografia cinematografica in maiuscolo.

Design orientato alle conversioni, che elimina gli ostacoli e guida gli utenti all'azione con chiarezza, fiducia e rapidità.

Design giocoso e minimalista, con colori vivaci, forme arrotondate, bordi tattili in 3D e illustrazioni accoglienti per interfacce accessibili.

Builder full-stack IA. Gradienti giocosi, estetica accogliente pensata per gli sviluppatori.

Estetica scura di alta gamma, con titoli audaci, palette monocromatica e un tocco esclusivo per esperienze di marchi di lusso.

Rete globale di pagamenti. Fondo color crema caldo, forme ovali orbitali, calore editoriale.

Material Design di Google, con superfici a livelli, temi dinamici, animazioni integrate e schemi adattabili alle diverse piattaforme.

Negozio tecnologico al dettaglio. Fotografia in primo piano, superfici chiare e scure binarie, CTA Meta Blue.

Design essenziale che privilegia gli spazi vuoti, la tipografia pulita e i colori sobri per garantire la massima chiarezza e concentrazione.

Fornitore di modelli IA. Interfaccia scura e audace con accenti neon.

Piattaforma di documentazione. Stile pulito con accenti verdi, ottimizzato per la lettura.

Collaborazione visiva. Accento giallo brillante, estetica da canvas infinita.

Monitoraggio di missioni spaziali e aerospaziali. Centro di comando scuro, telemetria ambra, precisione monospace. La chiarezza funzionale prima di tutto.

Fornitore di LLM open-weight. Minimalismo di ispirazione francese, tonalità viola.

Stile editoriale contemporaneo, con tipografia serif, palette essenziali e layout puliti per prodotti digitali curati.

Database documentale. Marchio con foglia verde, attenzione alla documentazione per sviluppatori.

Design basato sul monospace e ispirato alla matrice, con elementi ad alto contrasto, densità compatta ed estetica da hacker chic.

Una rilettura moderna del brutalismo, con bordi marcati, colori d’accento vivaci e layout essenziali ad alto contrasto su superfici calde.

Effetti luminosi al neon e abbinamenti cromatici ad alto contrasto per interfacce audaci e capaci di catturare l’attenzione.

Elementi UI morbidi e in rilievo, con ombre interne ed esterne su superfici monocromatiche, per un aspetto tattile e integrato.

Una base pulita e orientata al prodotto. Usala quando il brief non richiede un’atmosfera specifica: è adatta a strumenti B2B, dashboard e pagine funzionali.

Commercio al dettaglio sportivo. UI monocromatica, caratteri maiuscoli imponenti, fotografie a tutta pagina.

Spazio di lavoro tutto in uno. Minimalismo caldo, titoli con grazie, superfici morbide.

Calcolo GPU. Energia verde e nera, estetica tecnica e potente.

Esegui LLM in locale. Semplicità monocromatica, con il terminale in primo piano.

Piattaforma di programmazione con IA. Tema scuro pensato per gli sviluppatori.

Design ispirato alle sale giochi retrò, con caratteri pixelati, bordi puntinati, colori vivaci e contrastati ed estetica da gioco a 8 bit.

Design ispirato alla stampa, con texture della carta, pochi colori, tipografia pulita con e senza grazie e superfici dall’aspetto tattile.

Motore di ricerca conversazionale basato sull’IA. Sfondo molto scuro, tipografia nitida, un solo accento viola e una gerarchia densa delle informazioni.

Design con profondità spaziale: viste isometriche, punti di fuga ed elementi stratificati guidano l’attenzione con un realismo simile al 3D.

Scoperta visiva. Accenti rossi, griglia a mosaico, immagini in primo piano.

Commercio al dettaglio di console per videogiochi. Layout a tre livelli di superfici, tipografia espositiva autorevole ma discreta, scala ciano al passaggio del cursore.

Analisi dei prodotti. Identità giocosa con il riccio, UI scura pensata per gli sviluppatori.

Estetica premium ispirata ad Apple, con spaziature precise, tipografia moderna e un linguaggio visivo raffinato e curato.

Design curato e adatto al business, con tipografia moderna, layout strutturati e un’identità visiva affidabile.

Linguaggio visivo ispirato alla stampa, pensato per libri, riviste e report, con griglie editoriali e tipografia espressiva.

Launcher per la produttività. Interfaccia scura elegante, accenti vivaci sfumati.

Stile moderno e minimalista, curato nei dettagli, con eleganti caratteri con grazie e palette sofisticate e discrete.

Automobilismo francese. Sfumature aurora vivaci, tipografia NouvelR, energia decisa.

Esegui modelli di ML tramite API. Sfondo bianco pulito, codice in primo piano.

Email tramite API. Tema scuro essenziale, accenti monospaziati.

Design nostalgico con tipografia d’ispirazione vintage, palette retrò ad alto contrasto ed elementi visivi evocativi.

Generazione di video con IA. UI scura cinematografica, layout ricco di contenuti multimediali.

CMS headless. Accento rosso, layout editoriale incentrato sui contenuti.

Monitoraggio degli errori. Dashboard scura ricca di dati, accenti rosa e viola.

Design ispirato a Shadcn/ui, con componenti essenziali e puliti, palette monocromatica e schemi orientati alle utility.

Piattaforma di e-commerce. Estetica cinematografica dominata dai toni scuri, accento verde neon, caratteri ultraleggeri.

Design lineare e senza fronzoli, con tipografia pulita, colori neutri e layout intuitivi che non distraggono.

Imita il mondo reale con superfici materiche, effetti 3D e metafore fisiche familiari per creare interfacce digitali intuitive.

Estetica minimalista moderna, con linee pulite, palette cromatica intenzionale, interazioni discrete e spaziature coerenti.

Tecnologia spaziale. Bianco e nero essenziali, immagini a tutta pagina, atmosfera futuristica.

Spazi bianchi ampi, padding uniformi e layout basati su griglie per interfacce pulite, leggibili e ariose.

Streaming musicale. Verde vivace su sfondo scuro, caratteri decisi, copertine degli album in primo piano.

Marchio globale del commercio al dettaglio di caffè. Sistema a quattro livelli di verde, sfondo color crema caldo, pulsanti a pillola.

Design narrativo che usa immagini, testi e interazioni per accompagnare gli utenti in percorsi coinvolgenti ed emozionanti.

Alternativa open source a Firebase. Tema verde smeraldo scuro, codice in primo piano.

Client email veloce. UI scura premium, progettata per l’uso da tastiera, con bagliori viola.

Design ispirato ai classici giochi a blocchi, con colori giocosi, caratteri espositivi decisi e layout compatti e dinamici.

Media editoriali di tecnologia. Accenti verde menta acido e ultravioletto, carattere espositivo Manuka, riquadri narrativi ispirati ai volantini rave.

Infrastruttura IA open source. Design tecnico in stile blueprint.

Superficie: web A Un sistema cosmico e premium, scuro e con effetto vetro, che cattura lo stupore viscerale di un’eclissi solare: superfici color ossidiana, bagliori ambrati della «corona» e accenti atmosferici ciano.

Piattaforma per la mobilità. Bianco e nero decisi, tipografia compatta, energia urbana.

Distribuzione frontend. Precisione in bianco e nero, carattere Geist.

Design vivace e colorato, con tipografia giocosa e audace, accenti caldi ed energia dinamica.

Nostalgia dagli anni Cinquanta agli anni Novanta, con tocchi skeuomorfici, texture granulose, palette retrò e tipografia in stile pixel.

Marchio globale di telecomunicazioni. Caratteri espositivi maiuscoli e monumentali, fasce di capitolo Vodafone Red.

Framework per agenti AI. Sfondo nero assoluto, accento verde smeraldo, progettato per il terminale.

Estetica da rivista guidata dai caratteri con grazie. Accento terracotta su carta bianco caldo: ideale per contenuti lunghi, progetti editoriali e pagine di marketing incentrate sul marchio.

Terminale moderno. Interfaccia scura simile a un IDE, con comandi organizzati in blocchi.

Visual web builder. Estetica curata da sito di marketing, con accenti blu.

Rivista di tecnologia. Densità da quotidiano su fondo bianco carta, carattere espositivo personalizzato con grazie, richiami in monospaziato, link blu inchiostro.

Laboratorio di IA di Elon Musk. Monocromia essenziale, minimalismo futuristico.

Piattaforma social di contenuti lifestyle generati dagli utenti. Un solo rosso di marca, angoli ampi e contenuti in primo piano.

Piattaforma di automazione. Arancione caldo, illustrazioni amichevoli in primo piano.