87 caractères · libres à copier

Caractères de dessin de boîte

Le bloc Unicode U+2500 à U+257F contient 128 caractères conçus pour s'assembler en cadres, tableaux, arborescences et grilles — fin, épais, double, pointillé et arrondi, plus chaque jonction où ces épaisseurs se rencontrent. C'est ce dont sont réellement faits une interface de terminal, une arborescence de dossiers et un tableau ASCII. Copiez n'importe quel caractère ci-dessous ; chacun est répertorié avec son nom Unicode et son point de code, regroupés pour que les pièces dont vous avez besoin ensemble se trouvent ensemble.

Lignes fines

Le jeu par défaut. Onze caractères dessinent n'importe quelle grille rectangulaire, et chacun se raccorde proprement aux autres.

Lignes épaisses

Les onze mêmes formes dans une épaisseur plus marquée. À mélanger avec les lignes fines pour souligner une bordure extérieure ou une rangée sélectionnée.

Lignes doubles

Deux traits parallèles. Le cadre classique de l'ère DOS, toujours l'option la plus décorative du bloc.

Coins arrondis

Des coins en arc qui adoucissent une boîte à lignes fines. Substituez-les à ┌ ┐ └ ┘ sans rien changer d'autre.

Lignes pointillées

Séries de tirets triples et quadruples, fins et épais. Utiles pour un séparateur qui doit se lire comme secondaire.

Diagonales et demi-traits

Des barres obliques pour barrer une cellule, et des moignons à demi-longueur pour des fins de ligne qui s'arrêtent au milieu d'une cellule.

Transitions fin-épais

Jonctions où une ligne fine rencontre une ligne épaisse. C'est ce qui permet d'épaissir une rangée d'un tableau sans casser les raccords.

Transitions double-simple

Jonctions entre lignes doubles et simples — les pièces dont vous avez besoin quand un cadre extérieur double rencontre des séparateurs intérieurs simples.

Cliquez sur un caractère pour le copier. Rien n'est téléchargé — ce sont des caractères de texte, pas des images.

Blocs Unicode

  • U+2500–U+257F Dessin de boîte

Comment utiliser Caractères de dessin de boîte

01

Utilisez toujours une police à chasse fixe

C'est la règle dont tout le reste dépend. Les caractères de dessin de boîte sont conçus sur une cellule fixe, donc dans une police proportionnelle, les traits verticaux se désalignent et le cadre se disloque. JetBrains Mono, Menlo, Consolas, Cascadia Code et DejaVu Sans Mono affichent bien le bloc.

02

Choisissez une épaisseur et restez-y

Le fin se raccorde au fin et l'épais se raccorde à l'épais. Les mélanger sans les pièces de transition laisse des trous visibles où les traits ne se rejoignent pas. Si vous voulez vraiment une bordure extérieure épaisse avec des séparateurs intérieurs fins, prenez les jonctions dans le groupe des transitions fin-épais.

03

Construisez les coins, puis les bords, puis les jonctions

Un tableau, ce sont quatre coins, deux traits de bord et les intersections entre eux. Disposez d'abord les coins et le reste suit mécaniquement — ce qui explique aussi pourquoi c'est facile à générer par code.

04

Réglez line-height à 1 pour des cadres solides

Les traits verticaux sont dessinés sur toute la hauteur de la cellule de caractère. Tout interlignage supplémentaire apparaît comme un trou entre les rangées, donc une boîte qui semble cassée a généralement juste besoin de line-height: 1.

À propos de Caractères de dessin de boîte

Le bloc de dessin de boîte descend directement du jeu de caractères de la page de code 437 du PC IBM, qui donnait à DOS ses cadres et ses menus des décennies avant que quiconque puisse compter sur du graphisme. Unicode a préservé tout le répertoire à U+2500, et il reste en usage constant : les bordures d'un gestionnaire de fichiers en terminal, les branches d'une arborescence de dossiers, les cadres autour d'un tableau en ligne de commande et les grilles des jeux de ce site sont tous dessinés à partir de ces 128 caractères.

Ce qui rend ce bloc particulièrement bien conçu, c'est la couverture systématique des jonctions. Il ne suffit pas d'avoir une ligne horizontale et une ligne verticale ; il faut chaque combinaison de ce qui arrive à une cellule depuis chacune des quatre directions, à chaque épaisseur. C'est pourquoi le bloc contient des caractères aussi spécifiques que « bas fin et horizontal épais » — ils existent pour qu'un tableau puisse changer d'épaisseur de trait en cours de route sans qu'aucun trou n'apparaisse à la jonction.

La contrainte pratique, c'est la police. Ces glyphes sont dessinés pour toucher exactement les bords de leur cellule de caractère, afin que les cellules adjacentes se raccordent en un trait continu. Cela ne tient que dans une police à chasse fixe avec un interligne de 1. Donnez au texte un interlignage supplémentaire et des filets horizontaux apparaissent entre les rangées ; utilisez une police proportionnelle et les verticales se désalignent. Presque tous les problèmes de « dessin de boîte cassé » se résument à l'un de ces deux points.

Il existe un manque délibéré dans le bloc. Unicode encode les diagonales fines et épaisses et une croix diagonale fine, mais aucune diagonale double et aucun arc en épaisseur épaisse, parce que la page de code d'origine n'en avait aucun et que le bloc a été conçu pour la compatibilité plutôt que pour l'exhaustivité. Si vous avez besoin d'un coin arrondi épais, il n'existe pas — les quatre arcs de U+256D à U+2570 sont uniquement en épaisseur fine.

Jeux dessinés avec ces caractères

Chaque plateau de ce site est construit à partir d'Unicode, pas de sprites. Ceux-ci utilisent les caractères ci-dessus.

Questions fréquentes

Pourquoi mes caractères de dessin de boîte ne s'alignent-ils pas ?

Presque toujours la police. Ces glyphes supposent une cellule à largeur fixe, donc une police proportionnelle désaligne les traits verticaux. Passez à une police à chasse fixe comme JetBrains Mono, Consolas ou Menlo. Si le cadre s'aligne horizontalement mais montre des trous entre les rangées, réglez line-height à 1 — un interlignage supplémentaire sépare les traits verticaux.

Quelle est la différence entre les caractères de dessin de boîte et l'art ASCII ?

L'art ASCII simule des lignes avec les 128 caractères de l'ASCII — tirets, barres verticales et signes plus — donc les coins sont approximatifs et les jonctions visiblement grossières. Les caractères de dessin de boîte sont des glyphes conçus sur mesure qui se rejoignent exactement au bord de la cellule, donnant des traits continus et ininterrompus. Ce sont des caractères Unicode, pas de l'ASCII, bien que les deux soient souvent confondus.

De quels caractères de dessin de boîte ai-je besoin pour un tableau simple ?

Onze : les quatre coins ┌ ┐ └ ┘, les deux bords ─ │, les quatre jonctions en T ├ ┤ ┬ ┴ et la croix ┼. Toute grille rectangulaire, aussi grande soit-elle, se construit avec seulement ceux-là.

Puis-je mélanger lignes fines et épaisses ?

Oui, mais uniquement via les caractères de transition. Une verticale épaisse qui rencontre une horizontale fine a besoin d'un glyphe conçu exactement pour ce cas, comme U+2542. Raccorder une ligne épaisse directement à une ligne fine sans la bonne pièce laisse un trou visible. Le groupe des transitions fin-épais ci-dessus contient l'ensemble complet.

Les caractères de dessin de boîte fonctionnent-ils sur mobile ?

Ils s'affichent sur tout téléphone moderne — le bloc est ancien et universellement pris en charge. Le piège, c'est que les navigateurs mobiles utilisent souvent une police par défaut proportionnelle, donc encadrez-les avec une règle CSS monospace plutôt que de faire confiance au défaut, sinon l'alignement se casse.

Existe-t-il des coins arrondis dans le bloc de dessin de boîte ?

Oui, quatre, à U+256D à U+2570, et ils sont uniquement en épaisseur fine. Substituez-les à ┌ ┐ └ ┘ pour adoucir une boîte à lignes fines. Il n'existe aucun équivalent épais ou à ligne double — le bloc a hérité son répertoire de la page de code 437, qui n'en avait aucun.

Support the arcade

Vous aimez les jeux ?

UnicodeGames est gratuit, sans publicité, et le restera. Si le site a égayé une pause café, vous pouvez rendre la pareille.

Offrez-moi un café

One-off · No account needed · Handled by Buy Me a Coffee