Blog 106 block design & features
Blog106 is an A to Z tag directory built from plain shadcn/ui styling. A heading and description lead into a bar of all twenty-six letters, where letters that have tags link down to their group and empty letters are dimmed. The tags themselves flow through four columns, grouped under large letter headings with a strong rule beneath, and each tag runs a dotted leader across to its article count like a book index.
Dense and orderly, it relies on rules and type rather than surfaces. Letter headings are large and bold, tag names are medium weight, and counts sit in a mono face so they line up. Letters in the jump bar fill with the foreground color on hover, and tag names underline. Groups never split across columns, and each one leaves space at the top when jumped to.
It feels like the index at the back of a reference book, a timeless pattern that suits blogs with a long tail of tags. The block is content-driven and simple to fill: it takes a flat list of tags with counts, sorts them, and groups them by first letter on its own, putting tags that start with a number or symbol under a final group.
The columns step down to two on tablets and one on phones, and the letter bar wraps.