Blog 52 - Editorial hero with compact post grid

Pro

Wide featured story with author byline and read time above a four-column grid of compact photo cards with category, title, date, and read time.

Shadcn Blog 52 block

Component data

ID
blog52
Access
pro
Created
Aug 19, 2026
Type
block
Libraries
Radix UI, Base UI, React Aria

Blog 52 block design & features

Blog52 is an editorial well built with shadcn/ui surfaces. A label and heading introduce a full-width featured story: a very wide cover, then a split footer with category, title, excerpt, and author avatar on the left, and clock, date, and a read-the-story cue on the right. Below that, four compact cards sit in a row with a 4:3 image, category, title, date, and read time.

The featured card is a single bordered shell so the photograph and copy feel like one unit. Secondary cards are smaller and tighter, with muted metadata and a primary title tint on hover. Hierarchy comes from the ultra-wide crop versus the compact grid rather than extra decoration.

This is a classic magazine homepage pattern. Complexity is moderate and mixed: one featured object with author details plus four supporting posts with photography.

On smaller screens the featured footer stacks, and the four-up grid drops to two columns, then one.