cssday 2026

09:30 (15 minutes)

👋 Opening by GrUSP

Un viaggio spazio-temporale nel CSS di domani, dove HTML è lo stato e CSS è la logica. Useremo i typed attr() per trasformare il DOM nello state layer, useremo @function() per implementare dove necessario il logics layer, e combinando custom properties e il branching delle if() copriremo anche tutte le necessità del data layer, consentendo quindi di impacchettare componenti riutilizzabili, dichiarativi e dinamici con il minor apporto di JS possibile, HTML che passa “props” ai componenti e CSS che decide cosa fare. Mostreremo interfacce utente “temporali”, passando da stati passati a futuri modificando solo gli attributi, dimostrando fino a che punto è possibile spingere l’interazione e l’architettura con il solo CSS. (caratteristiche: attr() tipizzato, if() e la at-rule @function) La UI salta ad 88 miglia orarie!

Il focus è fondamentale per chi naviga da tastiera.
 Spesso, però, viene rimosso, nascosto o lasciato al default del browser. In molti progetti diventa un dettaglio tecnico invece che una scelta progettuale: outline eliminati, indicatori poco contrastati o difficili da distinguere dallo sfondo. Parleremo di come progettare stati di focus efficaci: perché non andrebbe mai eliminato, come renderlo chiaramente visibile e quali buone pratiche adottare perché sia davvero utile. Perché il focus non è un dettaglio: è una parte fondamentale dell’esperienza.

11:00 (30 minutes)

☕️ Pausa Caffè

Un design system non deve per forza basarsi su molti token generati a build-time. Con le tecniche moderne del CSS (custom properties, logical properties, color-mix, clamp, calc e altre) è possibile ottenere palette, spaziature e varianti che si adattano direttamente a runtime. Vedremo, con esempi pratici, come costruire un design system più leggero e flessibile.

Cosa succede quando una singola modifica a una riga di CSS impatta contemporaneamente su 50 testate editoriali e milioni di utenti? In un contesto enterprise multi-brand, il CSS non è solo stile, è un’infrastruttura critica. Parleremo di performance non come un “plus”, ma come un requisito di business: in ambito editoriale, ogni millisecondo di rendering pipeline risparmiato si traduce in una migliore SEO e in un Core Web Vitals ottimizzato.

Il modo di gestire i colori in CSS sta cambiando per sempre. I nuovi display supportano gamut più ampi, “colori che voi RGB e HSL non potete nemmeno immaginare”(semicit.). Con OKLCH finalmente il colore torna umano: intuitivo, leggibile, prevedibile. La luminosità che si imposta nel codice è quella che percepisce l’occhio. E con calc() puoi generare intere palette dinamiche in maniera semplice e chiara. Scopriremo insieme perché, una volta capito, non vorrai più tornare indietro.

12:50 (80 minutes)

🍽️ Pausa Pranzo

I font variabili sono uno degli strumenti più maturi e sottoutilizzati del web moderno. Permettono di concentrare più stili in un singolo file, riducendo richieste e peso complessivo, e offrono un livello di controllo tipografico che i font statici non possono raggiungere. I variable fonts funzionano particolarmente bene sul web: alcuni assi di variazione sono strumenti ideali per le interfacce, e il CSS moderno consente un controllo estremamente preciso. Leggibilità, coerenza e, spesso, anche vantaggi concreti in termini di performance.

Nel mondo tech la disruption e la novità sono spesso celebrate, mentre la stabilità e la manutenzione restano invisibili. Questa presentazione vuole presentare il CSS come esempio di tecnologia progettata per durare: uno standard che evolve lentamente, preserva la retrocompatibilità e resiste nel tempo, a differenza di molte librerie e framework dal ciclo di vita breve. Senza rifiutare l’innovazione, il talk mette in discussione il mito dello sviluppatore “disruptive” e invita a riflettere su cosa significhi davvero costruire software pensato per durare.

15:25 (30 minutes)

☕️ Pausa Caffè

Fino a quanto si può spingere il CSS oggi? Non parlo di esperimenti, trick o piccole cosettine carine come quelle che si vedono di solito. Si può mettere in produzione, usato da migliaia di persone, un progetto che combina SVG e CSS moderno per fare rendering… di docce? In questo talk vi mostrerò come, per uno dei miei clienti, ho utilizzato i tool più resilienti del web, markup e styling, uniti a una sana dose di pazzia, per mettere online una delle cose più folli che abbia mai fatto. Il tutto con il beneplacido entusiasta di un cliente pagante!

Quante ore passiamo con il tasto destro su “Ispeziona”, navigando tra DOM tree infiniti e regole CSS sovrascritte, solo per capire perché quel margin non si applica o perché il layout si rompe su un device specifico? L’AI generativa ci aiuta già a scrivere codice nell’editor, ma il vero “dolore” del Frontend Developer è nel browser, a runtime. In questo talk vedremo come il Model Context Protocol (MCP) permette di collegare l’intelligenza di Gemini direttamente al motore di Chrome. Trasformeremo il browser in un collaboratore attivo a cui chiedere – in linguaggio naturale: “Perché questo elemento non è centrato?” (Debug del Box Model) “Controlla il contrasto dei colori in Dark Mode.” (Audit di Accessibilità) “Fammi vedere come appare questa sezione su un tablet 1024px.” (Testing Responsivo automatizzato) Niente più caccia al tesoro nei pannelli dei DevTools: una demo pratica per scoprire come l’AI può diventare il “pair designer” che hai sempre sognato, direttamente nel tuo terminale.

17:10 (10 minutes)

👋 Closing by GrUSP

17:20 (60 minutes)

🍹 Networking libero