---
title: "Blog blocks"
description: "4 Pro blog blocks for React. Post lists, article headers and changelogs."
plan: Pro
docs: https://ui.edbn.me/docs/blocks/blog
---

# Blog blocks

4 Pro blog blocks for React. Post lists, article headers and changelogs.

## Installation

Once per project, create a token at https://ui.edbn.me/dashboard/tokens, put it in `.env.local` as `EDBN_TOKEN`, and add the registry to `components.json`:

```json
{
  "registries": {
    "@edbn": {
      "url": "https://ui.edbn.me/r/{name}.json",
      "headers": { "Authorization": "Bearer ${EDBN_TOKEN}" }
    }
  }
}
```

Then install any block by name, for example:

```bash
npx shadcn@4.19.0 add @edbn/blog-post-grid
```

## Blocks
- [Blog post grid](https://ui.edbn.me/docs/blocks/blog-post-grid): A journal index with category filters and posts in three columns, each with its cover, excerpt, author and reading time, and Load more.
  Install: `npx shadcn@4.19.0 add @edbn/blog-post-grid`
- [Featured post and list](https://ui.edbn.me/docs/blocks/blog-featured-list): A journal's lead story with a large photo, excerpt and author, beside the four most recent posts with thumbnails.
  Install: `npx shadcn@4.19.0 add @edbn/blog-featured-list`
- [Article header](https://ui.edbn.me/docs/blocks/article-header): The top of an article: breadcrumb, title, one-line summary, author row with share buttons, and a full-width cover photo.
  Install: `npx shadcn@4.19.0 add @edbn/article-header`
- [Changelog list](https://ui.edbn.me/docs/blocks/changelog-list): Dated releases, each with its version, title, changes tagged New, Improved or Fixed and an optional glimpse of the change.
  Install: `npx shadcn@4.19.0 add @edbn/changelog-list`

All blocks: https://ui.edbn.me/docs/blocks (Markdown: https://ui.edbn.me/docs/blocks.md)

## For agents
- Base theme, once per project: npx shadcn@4.19.0 add https://ui.edbn.me/r/edbn-base.json
- MCP server with search, items, examples and source: https://ui.edbn.me/mcp
- Every page and item: https://ui.edbn.me/llms.txt