Blog 25 block design & features
Blog25 is a three-column excerpt grid with category pills, styled with Shadcn UI theme colors. The header holds a heading and, directly beneath it, a wrapping row of small rounded pills, one per category. Up to six posts follow, each with a linked title, an excerpt clamped to two lines, and a read time.
The first pill is filled in the foreground color with inverted text, marking it as active, while the rest sit on a muted fill and darken their label on hover. Posts carry no border, surface, or image, separated only by open gutters. Read times use a fainter muted tone than the excerpts, so they read as the quietest line in each entry. Titles underline on hover.
The pill row is what distinguishes it, giving the grid the look of a filterable archive even though the pills are plain links and do not change the posts shown. The overall feel is light and orderly, a common pattern done with restraint. Complexity is low: six summaries with read times and a short list of category names.
Three columns on large screens, two on medium screens, and a single stack on mobile, with the pills wrapping onto extra lines as needed.