Come è fatto questo sito.
Per chi guarda i dettagli.
I caratteri, i colori, le foto e gli strumenti, con le loro licenze.
Il nome.
In giapponese sumi è l'inchiostro di china, quello che si macina sulla pietra prima di scrivere; post è la posta. Il marchio è solo il nome, scritto in Inter Tight con il rosso shu: nessun simbolo accanto.
Il sistema.
La grafica è Ardesia Web, il sistema del sito. È il fratello di Ardesia, il sistema dell'app: stessi colori con gli stessi nomi, stessi caratteri, stesse forme. Cambia il volume: il sito parla forte, l'app parla piano.
I dettagli.
Per chi guarda da vicino. Premi G e compare la griglia su cui è impaginato il sito: i margini, la colonna del righello, dodici colonne e il passo di 8 pixel. I righelli sotto i titoli misurano il cursore, il punto rosso cade come una goccia, la parola in fondo alla pagina prende peso dove passi. Un clic su un colore qui sotto lo copia.
Caratteri.
| Carattere | Uso | Autori | Licenza |
|---|---|---|---|
| Inter Tight | Titoli e numeri | The Inter Project Authors | SIL Open Font License 1.1 · testo |
| Inter | Testo | The Inter Project Authors | SIL Open Font License 1.1 · testo |
| IBM Plex Mono | Occhielli, etichette, pulsanti e codice | IBM Corp. | SIL Open Font License 1.1 · testo |
| Bodoni Moda, Manrope, Cormorant Garamond, Playfair Display | Solo nelle email dei marchi d'esempio | I rispettivi Project Authors | SIL Open Font License 1.1 · bodoni-moda, manrope, cormorant-garamond, playfair-display |
I caratteri sono ospitati su questo sito, nei sottoinsiemi latini: nessuna richiesta a servizi di terzi. Vengono dai pacchetti Fontsource 5.3.0, che riprendono i file pubblicati su Google Fonts (licenze verificate il 2/11/2026).
Tre colori hanno un compito.
- --shu
Agisce
Il rosso del marchio colora l'unica azione principale di una sezione.
- --ardesia
Sceglie
Segna ciò che è selezionato: il marchio scelto, la vista, il segmento.
- --limone
Dice dove sei
La pagina aperta nel menu, la tacca accesa del righello.
Tutti i colori, Notte e Carta
- ground
#14161C · #F3F3F5 - dot
#2E3240 · #D5D8E0 - surface
#1E212A · #FFFFFF - surface-muted
#262A35 · #F6F7F9 - placeholder
#2B2F3B · #EEF0F4 - line
#343947 · #E2E4EA - line-soft
#2B2F3B · #E9EBF1 - line-strong
#4A5063 · #A9AEC0 - ink
#F1F2F5 · #15171F - text
#CDD1DC · #3F4560 - display
#C3C8D6 · #4A5170 - text-muted
#9CA2B4 · #6A7083 - icon-muted
#5E6476 · #A9AEC0 - shu
#C8391B · #C8391B - on-shu
#FFFFFF · #FFFFFF - shu-vivo
#F0583A · #C8391B - ardesia
#B9BED0 · #5F667F - on-ardesia
#15171F · #FFFFFF - limone
#E4E06A · #EEEB72 - on-limone
#15171F · #15171F - limone-soft
#45431F · #F8F7C9 - inverse
#F1F2F5 · #1B1E29 - on-inverse
#15171F · #FFFFFF - success
#6FBF96 · #2F6E52 - error
#FF9DB0 · #9E1C3A - focus
#B9BED0 · #5F667F - scrim
rgba(14,16,21,0.65) · rgba(14,16,21,0.55)
Ogni colore ha due valori: a sinistra Notte, il tema di casa del sito; a destra Carta, il tema delle sezioni chiare. Gli stessi 27 colori, con gli stessi nomi, sono quelli dell'app.
Le foto sono generate con l'AI.
Le foto di questo sito sono generate con l'intelligenza artificiale, con lo strumento di immagini di Codex di OpenAI, il 2 novembre 2026, a partire da indicazioni scritte da noi: carta e inchiostro, fiori di carta indaco, ritratti in bianco e nero. I ritratti sono ruoli, non persone che lavorano da noi, e non esistono. Le scegliamo, le scartiamo e le ritagliamo a mano, e lo scriviamo accanto a ognuna (art. 50 dell'AI Act). Niente pupazzi né mascotte.
Con lo stesso strumento sono fatte le foto dei marchi d'esempio (Fumaria, Studio Lume, Cantina Vespri, Brezza): persone e luoghi che non esistono. Le tre foto di Fumaria, una profumeria artigianale inventata da noi, sono del 2 novembre 2026. Le schermate, invece, vengono dall'app vera.
Gli strumenti.
HTML, CSS e un po' di JavaScript scritti a mano, generati in pagine statiche da un piccolo programma in Node. Nessun framework, nessun cookie, nessun sistema di statistiche. Senza JavaScript ogni pagina resta completa.