Elementi Blocco ░ ▒ ▓ █
Retini a quattro densità, mezzi blocchi, quadranti e ottavi per costruire grafica con il solo testo.
Tutti gli elementi blocco
Clicca su un carattere per copiarlo negli appunti
Raccolte di blocchi da copiare
Gruppi ordinati per uso
Densità
4 elementi
Mezzi blocchi
4 elementi
Quadranti
10 elementi
Barra di avanzamento
3 elementi
Sfumature
3 elementi
Ottavi verticali
8 elementi
Il blocco Block Elements (U+2580–U+259F) contiene trentadue caratteri pensati per disegnare senza grafica. Il gruppo più conosciuto sono le quattro densità — ░ ▒ ▓ █ — che riproducono i retini della code page 437: sul PC IBM occupavano le posizioni 176, 177, 178 e 219 e servivano a simulare le sfumature su schermi che avevano solo due colori. Accostati in sequenza ░▒▓█ producono ancora oggi la sfumatura più riconoscibile della grafica testuale.
Gli ottavi sono la parte più utile per chi lavora con i dati. ▁▂▃▄▅▆▇█ salgono da un ottavo di altezza fino al blocco pieno e permettono di disegnare un microgramma dentro una riga di testo: sono i caratteri che stanno dietro le sparkline dei terminali, dove una serie di valori diventa un profilo alto una sola riga. La serie orizzontale ▏▎▍▌▋▊▉█ fa la stessa cosa in larghezza ed è quella che le barre di avanzamento dei programmi da riga di comando usano per muoversi di un ottavo di carattere alla volta, dando l'impressione di uno scorrimento fluido.
I dieci quadranti ▖ ▗ ▘ ▝ ▙ ▚ ▛ ▜ ▞ ▟ suddividono invece la cella in quattro quarti e raddoppiano la risoluzione: ogni carattere diventa una griglia di due per due punti, quindi un'immagine disegnata con questi caratteri ha il doppio dei pixel rispetto a una fatta con █ e spazi.
Il limite da conoscere riguarda la resa. Molti font disegnano il blocco pieno leggermente più stretto della cella, così due █ affiancati mostrano una linea chiara verticale nel mezzo, e lo stesso succede tra due righe sovrapposte. I font pensati per il terminale riempiono la cella per intero e non hanno il problema; nei font proporzionali dei social l'effetto è invece quasi garantito, oltre al fatto che le larghezze diverse distruggono l'allineamento.
Barre di avanzamento, sparkline e grafici in cella
Il caso d'uso più immediato è la barra di avanzamento in un messaggio o in una nota: █ per la parte completata e ░ per quella mancante, in venti posizioni, con la percentuale scritta accanto. Usare due caratteri con la stessa larghezza è essenziale, perché mescolare █ con uno spazio produce una barra che sembra più corta di quanto sia.
Nei fogli di calcolo esiste un uso meno noto e molto pratico. La formula che ripete un carattere — REPT in Excel e in Fogli Google — permette di costruire un istogramma dentro la cella: ripetendo █ un numero di volte proporzionale al valore si ottiene una barra che si aggiorna con i dati, resta testo, si può ordinare e non richiede alcun grafico. Con gli ottavi si può perfino rifinire l'ultima frazione, aggiungendo ▌ quando il valore supera la metà della posizione successiva.
Per la pixel art vale invece la regola dei quadranti: conviene lavorare su una griglia pari, perché ogni carattere copre due punti in orizzontale e due in verticale, e verificare il risultato in un font a spaziatura fissa prima di condividerlo.
Come usare gli elementi blocco
Scegli la densità
Le quattro densità ░ ▒ ▓ █ coprono la scala dal chiaro al pieno
Copia
Un clic mette il carattere negli appunti, senza installare nulla
Usa il monospazio
Incolla in un blocco di codice o in un font a spaziatura fissa per un allineamento esatto
Domande Frequenti
A disegnare con il solo testo: barre di avanzamento, istogrammi dentro una cella, sparkline, pixel art, sfumature e sfondi nelle interfacce da terminale. Il vantaggio rispetto a un’immagine è che il disegno resta testo, quindi si copia, si cerca e sopravvive in un terminale, in un file di log o in una nota senza formattazione.
Cambia la densità del retino: ░ (U+2591) copre circa un quarto della cella, ▒ (U+2592) circa la metà, ▓ (U+2593) circa tre quarti e █ (U+2588) la riempie tutta. In sequenza formano una scala di grigi simulata, l’unico modo di suggerire una sfumatura quando si hanno a disposizione soltanto caratteri.
Fissa una lunghezza, per esempio venti posizioni, e riempi con █ la porzione completata e con ░ quella mancante: ██████████░░░░░░░░░░ per il cinquanta per cento. Aggiungi sempre la percentuale in cifre accanto alla barra, perché chi usa un lettore di schermo sente pronunciare venti nomi di blocco senza ricavarne il valore.
Sì, e la risoluzione migliore la danno i quadranti ▖ ▗ ▘ ▝ ▙ ▚ ▛ ▜ ▞ ▟, che dividono ogni cella in quattro parti: l’immagine ha così il doppio dei punti in orizzontale e in verticale rispetto a un disegno fatto con █ e spazi. Lavora su una griglia di dimensioni pari e verifica il risultato in un font a spaziatura fissa.
Sì, ma solo dentro un blocco di codice il disegno resta allineato: nei messaggi normali il font è proporzionale e le righe si sfalsano. Racchiudi il disegno tra tre accenti gravi e otterrai lo stesso risultato su desktop e su telefono. Nelle biografie e nei nomi, dove il blocco di codice non esiste, l’allineamento non è garantito.
Perché molti font disegnano il blocco pieno leggermente più stretto della cella che gli spetta, e tra due caratteri affiancati resta una sottile riga chiara. I font progettati per il terminale riempiono la cella per intero e il problema non si presenta. Se il disegno deve essere impeccabile, scegli un font monospaziato pensato per il codice.
Sono gli ottavi di altezza, dal più basso al pieno, e servono a disegnare un grafico alto una sola riga. Assegnando a ogni valore l’ottavo corrispondente si ottiene il profilo di una serie di dati dentro il testo: è la tecnica delle sparkline, molto usata negli strumenti da riga di comando e nei riepiloghi di monitoraggio.
Sì, ed è uno degli usi più efficaci. Con la funzione che ripete un carattere si costruisce una barra dentro la cella: ripetendo █ un numero di volte proporzionale al valore si ottiene un istogramma che si aggiorna da solo, resta testo e si può ordinare e filtrare come qualunque altra colonna.