# Blog blocks for shadcn/ui

> 329 blog blocks from public shadcn/ui registries, free and paid, with live previews, source code and install commands.

- Page, with live previews: https://shadcn.exchange/blocks/blog
- 329 blocks, 80 free and 249 paid, from 30 registries.
- Search them as JSON: `https://shadcn.exchange/api/catalog?kind=blocks&category=blog&q=<words>`. Add `price=free` for the ones you can install, and `offset=<n>` for the next 24.
- With the shadcn CLI, which finds free blocks by their words: `npx shadcn@latest search @shadcn-exchange -q blog`

Each block's page answers in Markdown, source included, at its address with `.md` on the end. [The whole site for agents](https://shadcn.exchange/llms.txt).

## Free blog blocks

All 80 blocks, best first. Each installs with the command beside it, in a project that has shadcn/ui set up.

- [Blog 03 by @shadcnui-blocks](https://shadcn.exchange/r/shadcnui-blocks/blog-03): A simple blog post list. `npx shadcn@latest add https://shadcn.exchange/r/shadcnui-blocks/blog-03.json`
- [Blog 04 - Insights Feed by @shadcn-space](https://shadcn.exchange/r/shadcn-space/blog-04): A dynamic blog layout highlighting featured insights alongside recent articles, designed to improve content discovery, boost readership, and position your brand as a reliable source. `npx shadcn@latest add https://shadcn.exchange/r/shadcn-space/blog-04.json`
- [Magazine Feature With Drop Cap by @7ovr](https://shadcn.exchange/r/7ovr/article-4): Magazine feature article with a centered headline, wide cover image, drop-cap opening paragraph, pull quote, and save and share actions. `npx shadcn@latest add https://shadcn.exchange/r/7ovr/article-4.json`
- [Blogs 2 by @efferd](https://shadcn.exchange/r/efferd/blogs-2): Clean grid layout with bordered cards. `npx shadcn@latest add https://shadcn.exchange/r/efferd/blogs-2.json`
- [Blog 1 by @nusaiba](https://shadcn.exchange/r/nusaiba/blog-1): Three-column blog grid with image placeholders and category metadata. `npx shadcn@latest add https://shadcn.exchange/r/nusaiba/blog-1.json`
- [Blog 04 by @shadcnui-blocks](https://shadcn.exchange/r/shadcnui-blocks/blog-04): A simple blog block. `npx shadcn@latest add https://shadcn.exchange/r/shadcnui-blocks/blog-04.json`
- [Blog 01 - Latest Blog & News Grid by @shadcn-space](https://shadcn.exchange/r/shadcn-space/blog-01): A modern blog section with featured posts, large thumbnails, publish dates, and headlines, ideal for sharing agency updates, design insights, and thought leadership to keep visitors engaged. `npx shadcn@latest add https://shadcn.exchange/r/shadcn-space/blog-01.json`
- [Filterable Blog Index by @7ovr](https://shadcn.exchange/r/7ovr/blog-3): Blog index with a featured post, category filter pills, and a three-column grid of post cards that filters on selection. `npx shadcn@latest add https://shadcn.exchange/r/7ovr/blog-3.json`
- [Blogs 1 by @efferd](https://shadcn.exchange/r/efferd/blogs-1): Minimalist list with dashed dividers. `npx shadcn@latest add https://shadcn.exchange/r/efferd/blogs-1.json`
- [Blog 5 by @nusaiba](https://shadcn.exchange/r/nusaiba/blog-5): Horizontal scroll snap filmstrip with scale focus on the active cover slide. `npx shadcn@latest add https://shadcn.exchange/r/nusaiba/blog-5.json`
- [Blog 01 by @shadcnui-blocks](https://shadcn.exchange/r/shadcnui-blocks/blog-01): A simple blog post list. `npx shadcn@latest add https://shadcn.exchange/r/shadcnui-blocks/blog-01.json`
- [Divider Separated Post List by @7ovr](https://shadcn.exchange/r/7ovr/blog-2): Blog post list of five articles as divider-separated rows with category badge, date, title, excerpt, and author, with no cover images. `npx shadcn@latest add https://shadcn.exchange/r/7ovr/blog-2.json`
- [Blog 9 by @nusaiba](https://shadcn.exchange/r/nusaiba/blog-9): Infinite article title marquee with crossfading featured story card. `npx shadcn@latest add https://shadcn.exchange/r/nusaiba/blog-9.json`
- [Horizontal Media Cards by @7ovr](https://shadcn.exchange/r/7ovr/blog-4): Blog archive as a vertical list of horizontal media cards, each with a thumbnail, category, read time, title, excerpt, and author. `npx shadcn@latest add https://shadcn.exchange/r/7ovr/blog-4.json`
- [Three Card Post Grid by @7ovr](https://shadcn.exchange/r/7ovr/blog-1): Blog post grid of three cards with cover images, category badges, titles, excerpts, read time, and author avatars. `npx shadcn@latest add https://shadcn.exchange/r/7ovr/blog-1.json`
- [Article With Author Sidebar by @7ovr](https://shadcn.exchange/r/7ovr/article-5): Article layout with a sticky sidebar holding an author bio card, related post links, and an inline newsletter signup form. `npx shadcn@latest add https://shadcn.exchange/r/7ovr/article-5.json`
- [Centered Blog Post by @7ovr](https://shadcn.exchange/r/7ovr/article-1): Blog post article with a category badge, author byline and read time, cover image, prose body with a blockquote, and tag and share footer. `npx shadcn@latest add https://shadcn.exchange/r/7ovr/article-1.json`
- [Blog 05 by @shadcnui-blocks](https://shadcn.exchange/r/shadcnui-blocks/blog-05): A simple blog block. `npx shadcn@latest add https://shadcn.exchange/r/shadcnui-blocks/blog-05.json`
- [Blog With Sticky Sidebar by @7ovr](https://shadcn.exchange/r/7ovr/blog-5): Blog index with a post list beside a sticky sidebar of search, categories with counts, popular posts, and a tag cloud. `npx shadcn@latest add https://shadcn.exchange/r/7ovr/blog-5.json`
- [Blogs 3 by @efferd](https://shadcn.exchange/r/efferd/blogs-3): Immersive grid with images and gradients. `npx shadcn@latest add https://shadcn.exchange/r/efferd/blogs-3.json`
- [Blog 13 by @nusaiba](https://shadcn.exchange/r/nusaiba/blog-13): Sera series — typographic journal index with mono dates, hairline rows, and hover underlines. `npx shadcn@latest add https://shadcn.exchange/r/nusaiba/blog-13.json`
- [Blog Section One by @navui](https://shadcn.exchange/r/navui/blog-section-one): A semantic blog archive grouped by year, with aligned dates, useful metadata, and accessible row links. `npx shadcn@latest add https://shadcn.exchange/r/navui/blog-section-one.json`
- [Blog 02 by @shadcnui-blocks](https://shadcn.exchange/r/shadcnui-blocks/blog-02): A simple blog post list. `npx shadcn@latest add https://shadcn.exchange/r/shadcnui-blocks/blog-02.json`
- [Article With Scroll-Spy Contents by @7ovr](https://shadcn.exchange/r/7ovr/article-2): Long-form article with a sticky table of contents sidebar that scroll-spies and highlights the active section, collapsing to one column on mobile. `npx shadcn@latest add https://shadcn.exchange/r/7ovr/article-2.json`
- [Blog 2 by @nusaiba](https://shadcn.exchange/r/nusaiba/blog-2): Editorial blog spotlight — thumbnail rail, spring crossfade feature panel, auto-advance on pause-hover. `npx shadcn@latest add https://shadcn.exchange/r/nusaiba/blog-2.json`
- [Blog 06 by @shadcnui-blocks](https://shadcn.exchange/r/shadcnui-blocks/blog-06): A simple blog block. `npx shadcn@latest add https://shadcn.exchange/r/shadcnui-blocks/blog-06.json`
- [Blog component 17 by @shadcn-studio](https://shadcn.exchange/r/shadcn-studio/blog-component-17): Related posts blog grid with outline trending badge, centered header with "Related Post" heading, three-column responsive grid of blog cards with hover-scale images, calendar icons with dates, primary/10 border-0 category badges, line-clam… `npx shadcn@latest add https://shadcn.exchange/r/shadcn-studio/blog-component-17.json`
- [Blog Section 1 by @shadcnstore](https://shadcn.exchange/r/shadcnstore/blog-section-1): A clean three-card layout with image placeholders, categories, titles and call-to-action links. `npx shadcn@latest add https://shadcn.exchange/r/shadcnstore/blog-section-1.json`
- [Blog 02 by @ncdai](https://shadcn.exchange/r/ncdai/blog-02): A blog section with a lined grid layout. `npx shadcn@latest add https://shadcn.exchange/r/ncdai/blog-02.json`
- [Blog Author by @blockforge](https://shadcn.exchange/r/blockforge/blog-author): An author's bio and stats beside their essay archive. `npx shadcn@latest add https://shadcn.exchange/r/blockforge/blog-author.json`
- [Blog 02 by @hirael](https://shadcn.exchange/r/hirael/blog-02): Editorial post index as dated rows with a thumbnail that surfaces on hover, category tabs with counts that filter the list, and an empty state for a category with nothing in it yet. `npx shadcn@latest add https://shadcn.exchange/r/hirael/blog-02.json`
- [Blog component 15 by @shadcn-studio](https://shadcn.exchange/r/shadcn-studio/blog-component-15): Tabbed blog grid with centered header, scroll area tabs with category filtering (All, Product, Design, Startup Growth), search input with icon, three-column responsive grid of blog cards featuring hover-scale images, calendar icon with dat… `npx shadcn@latest add https://shadcn.exchange/r/shadcn-studio/blog-component-15.json`
- [Blog 01 by @ncdai](https://shadcn.exchange/r/ncdai/blog-01): A blog section with a grid layout. `npx shadcn@latest add https://shadcn.exchange/r/ncdai/blog-01.json`
- [Blog List by @blockforge](https://shadcn.exchange/r/blockforge/blog-list): Editorial index with a monospaced date column. `npx shadcn@latest add https://shadcn.exchange/r/blockforge/blog-list.json`
- [Blog 01 by @hirael](https://shadcn.exchange/r/hirael/blog-01): Editorial blog index with a featured post on top and a 4-column grid of post cards underneath. Built on Card and Badge. `npx shadcn@latest add https://shadcn.exchange/r/hirael/blog-01.json`
- [Blog component 01 by @shadcn-studio](https://shadcn.exchange/r/shadcn-studio/blog-component-01): Three-column blog grid with featured images, titles, descriptions, and read more buttons for journey and destination content. `npx shadcn@latest add https://shadcn.exchange/r/shadcn-studio/blog-component-01.json`
- [Blog 8 - Blog post rows with tags and large images by @shadcnblocks](https://shadcn.exchange/r/shadcnblocks/blog8): Two wide blog post rows, each with uppercase tags, a large title, excerpt, author, date, and read-more link beside an image, under a centered heading. `npx shadcn@latest add https://shadcn.exchange/r/shadcnblocks/blog8.json`
- [Video Blog by @shadcn-ui-blocks](https://shadcn.exchange/r/shadcn-ui-blocks/marketing-blog-sections-video-blog): A grid of video cards with thumbnails, durations, and titles. Use it to run a video first blog where each card opens a clip or full episode. `npx shadcn@latest add https://shadcn.exchange/r/shadcn-ui-blocks/marketing-blog-sections-video-blog.json`
- [Blog 7 - Blog post cards with read more links by @shadcnblocks](https://shadcn.exchange/r/shadcnblocks/blog7): Blog post cards with an edge-to-edge cover, author and date, title, excerpt, and an arrow read-more link, in a three-column grid under a centered heading. `npx shadcn@latest add https://shadcn.exchange/r/shadcnblocks/blog7.json`
- [Case Study Showcase by @shadcn-ui-blocks](https://shadcn.exchange/r/shadcn-ui-blocks/marketing-blog-sections-case-study-showcase): A grid of case study cards with logos, results, and short summaries. Use it to present customer stories and proof on a results focused blog page. `npx shadcn@latest add https://shadcn.exchange/r/shadcn-ui-blocks/marketing-blog-sections-case-study-showcase.json`
- [Latest posts by @balick](https://shadcn.exchange/r/balick/blog-01): Three recent articles with a cover, category, date, author and reading time. `npx shadcn@latest add https://shadcn.exchange/r/balick/blog-01.json`
- [Notion Blog Page by @uitripled](https://shadcn.exchange/r/uitripled/notion-blog-page-baseui): Notion-style publishing playbook with rich text, toggles, and supporting visuals (Base UI). `npx shadcn@latest add https://shadcn.exchange/r/uitripled/notion-blog-page-baseui.json`
- [Blog Post 1: article with contents and progress by @ballmac](https://shadcn.exchange/r/ballmac/blog-post-1): A long-form article page: centered title and author row, cover, comfortable prose with pull quote and code, sticky table of contents with scroll spy, reading progress bar, author card and related posts. `npx shadcn@latest add https://shadcn.exchange/r/ballmac/blog-post-1.json`
- [Blog Hover Expand by @tween-ui](https://shadcn.exchange/r/tween-ui/blog-hover-expand): A three-post blog row where the hovered card grows wider, its photo scales and tilts, and the title draws an underline. Pure CSS. `npx shadcn@latest add https://shadcn.exchange/r/tween-ui/blog-hover-expand.json`
- [Notion Blog Page by @uitripled](https://shadcn.exchange/r/uitripled/notion-blog-page-shadcnui): Notion-style publishing playbook with rich text, toggles, and supporting visuals. `npx shadcn@latest add https://shadcn.exchange/r/uitripled/notion-blog-page-shadcnui.json`
- [Blog 1: featured post with filterable grid by @ballmac](https://shadcn.exchange/r/ballmac/blog-1): A blog index with a large featured post, topic filter chips and a three-column grid. Posts without a photo get a generated cover drawn from theme tokens, in five compositions. `npx shadcn@latest add https://shadcn.exchange/r/ballmac/blog-1.json`
- [Blog Block by @uitripled](https://shadcn.exchange/r/uitripled/blog-block-baseui): Animated blog posts grid with staggered cards, date/time indicators, and hover effects (Base UI). `npx shadcn@latest add https://shadcn.exchange/r/uitripled/blog-block-baseui.json`
- [Blog Block by @uitripled](https://shadcn.exchange/r/uitripled/blog-block-shadcnui): Animated blog posts grid with staggered cards, date/time indicators, and hover effects. `npx shadcn@latest add https://shadcn.exchange/r/uitripled/blog-block-shadcnui.json`
- [Blog grid by @silicon-ui](https://shadcn.exchange/r/silicon-ui/blog-grid): A blog index with a featured post, category filter, post cards, pagination and an in-place reader. `npx shadcn@latest add https://shadcn.exchange/r/silicon-ui/blog-grid.json`
- [Blog 02 by @heyompatil](https://shadcn.exchange/r/heyompatil/blog-02): A blog section with a lined grid layout. `npx shadcn@latest add https://shadcn.exchange/r/heyompatil/blog-02.json`
- [Blog 01 by @heyompatil](https://shadcn.exchange/r/heyompatil/blog-01): A blog section with a grid layout. `npx shadcn@latest add https://shadcn.exchange/r/heyompatil/blog-01.json`
- [Filterable Archive Index by @beste-ui](https://shadcn.exchange/r/beste-ui/blog61): A dense blog archive whose subject pills are derived from the posts themselves and carry live counts, filtering a two-column list of hairline rows stamped with a date and a reading time. `npx shadcn@latest add https://shadcn.exchange/r/beste-ui/blog61.json`
- [Blog grid by @uiarc](https://shadcn.exchange/r/uiarc/blog-grid): A blog index with a featured post, category filter, post cards, pagination and an in-place reader. `npx shadcn@latest add https://shadcn.exchange/r/uiarc/blog-grid.json`
- [Blogpost 2 - Article with sticky sidebar by @shadcnblocks](https://shadcn.exchange/r/shadcnblocks/blogpost2): A two-column blog article with a sticky narrow column for back navigation, display title, and avatar byline beside a main column with hero image and full prose. `npx shadcn@latest add https://shadcn.exchange/r/shadcnblocks/blogpost2.json`
- [Featured List by @shadcn-ui-blocks](https://shadcn.exchange/r/shadcn-ui-blocks/marketing-blog-sections-featured-list): A list led by one large featured article above smaller stacked posts. Use it to spotlight your top story while listing the rest of the feed. `npx shadcn@latest add https://shadcn.exchange/r/shadcn-ui-blocks/marketing-blog-sections-featured-list.json`
- [Blog template by @neobrutal-ui](https://shadcn.exchange/r/neobrutal-ui/blog-template): An editorial archive with topic filters, search, sorting, and reading pages. `npx shadcn@latest add https://shadcn.exchange/r/neobrutal-ui/blog-template.json`
- [Blog Section v1 by @uiception](https://shadcn.exchange/r/uiception/blog-section-v1): Editorial All Articles layout with a featured Spotlight post (image, headline, author) and a Trending list of three compact articles. `npx shadcn@latest add https://shadcn.exchange/r/uiception/blog-section-v1.json`
- [Blog by @1st-pouf](https://shadcn.exchange/r/1st-pouf/blog): An example blog index — a featured post and a grid of cards. `npx shadcn@latest add https://shadcn.exchange/r/1st-pouf/blog.json`
- [Blogpost 1 - Centered article with alert and table by @shadcnblocks](https://shadcn.exchange/r/shadcnblocks/blogpost1): A single-post layout with centered title, subtitle, author row with avatar and site link, hero media, and prose body including headings, alert, table, and figures. `npx shadcn@latest add https://shadcn.exchange/r/shadcnblocks/blogpost1.json`
- [Author Spotlight by @shadcn-ui-blocks](https://shadcn.exchange/r/shadcn-ui-blocks/marketing-blog-sections-author-spotlight): A profile block pairing an author photo, bio, and their latest posts. Use it to build trust on a blog and surface more writing from one voice. `npx shadcn@latest add https://shadcn.exchange/r/shadcn-ui-blocks/marketing-blog-sections-author-spotlight.json`
- [Blog Section v2 by @uiception](https://shadcn.exchange/r/uiception/blog-section-v2): Two-column editorial layout with a sticky author sidebar (square photo, label, name, title, GitHub) and two title/description/image/body content sections. `npx shadcn@latest add https://shadcn.exchange/r/uiception/blog-section-v2.json`
- [Blog 120 - Six blog post cards with read more links by @shadcnblocks](https://shadcn.exchange/r/shadcnblocks/blog120): Two rows of three blog post cards with full-width covers, linked titles, author and date, two-line summaries, and read more links under a centered heading. `npx shadcn@latest add https://shadcn.exchange/r/shadcnblocks/blog120.json`
- [Compact List by @shadcn-ui-blocks](https://shadcn.exchange/r/shadcn-ui-blocks/marketing-blog-sections-compact-list): A dense vertical list of posts with titles, dates, and short excerpts. Use it to show many articles in little space on an index or archive page. `npx shadcn@latest add https://shadcn.exchange/r/shadcn-ui-blocks/marketing-blog-sections-compact-list.json`
- [Newsletter Blog by @shadcn-ui-blocks](https://shadcn.exchange/r/shadcn-ui-blocks/marketing-blog-sections-newsletter-blog): An article feed combined with an email signup form and short prompt. Use it to grow a subscriber list while showcasing your most recent posts. `npx shadcn@latest add https://shadcn.exchange/r/shadcn-ui-blocks/marketing-blog-sections-newsletter-blog.json`
- [Horizontal Blog Carousel by @shadcn-ui-blocks](https://shadcn.exchange/r/shadcn-ui-blocks/portfolio-portfolio-blog-writing-and-previews-horizontal-blog-carousel): A horizontal carousel of blog cards that scrolls sideways. Use it to preview recent posts in a tidy row without taking up much vertical space. `npx shadcn@latest add https://shadcn.exchange/r/shadcn-ui-blocks/portfolio-portfolio-blog-writing-and-previews-horizontal-blog-carousel.json`
- [Featured Article List by @shadcn-ui-blocks](https://shadcn.exchange/r/shadcn-ui-blocks/portfolio-portfolio-blog-writing-and-previews-featured-article-list): A list that leads with one large featured article followed by smaller entries. Use it to spotlight your best post while listing recent writing. `npx shadcn@latest add https://shadcn.exchange/r/shadcn-ui-blocks/portfolio-portfolio-blog-writing-and-previews-featured-article-list.json`
- [Hero Focus by @shadcn-ui-blocks](https://shadcn.exchange/r/shadcn-ui-blocks/marketing-blog-sections-hero-focus): A full width hero centered on a single article with a large cover image. Use it to launch a flagship post and pull readers straight into it. `npx shadcn@latest add https://shadcn.exchange/r/shadcn-ui-blocks/marketing-blog-sections-hero-focus.json`
- [Grid Blog Cards by @shadcn-ui-blocks](https://shadcn.exchange/r/shadcn-ui-blocks/portfolio-portfolio-blog-writing-and-previews-grid-blog-cards): A responsive grid of blog cards with cover image, title, and excerpt. The standard layout for browsing many articles on a writing index page. `npx shadcn@latest add https://shadcn.exchange/r/shadcn-ui-blocks/portfolio-portfolio-blog-writing-and-previews-grid-blog-cards.json`
- [Featured With Sidebar by @shadcn-ui-blocks](https://shadcn.exchange/r/shadcn-ui-blocks/marketing-blog-sections-featured-with-sidebar): A two column layout with a main article feed beside a sidebar of links. Use it for a blog home that mixes posts with categories and promos here. `npx shadcn@latest add https://shadcn.exchange/r/shadcn-ui-blocks/marketing-blog-sections-featured-with-sidebar.json`
- [Simple Grid by @shadcn-ui-blocks](https://shadcn.exchange/r/shadcn-ui-blocks/marketing-blog-sections-simple-grid): An even grid of article cards with cover images, titles, and dates. Use it as a clean, flexible blog index that scales to any number of posts. `npx shadcn@latest add https://shadcn.exchange/r/shadcn-ui-blocks/marketing-blog-sections-simple-grid.json`
- [Minimal Blog by @shadcn-ui-blocks](https://shadcn.exchange/r/shadcn-ui-blocks/marketing-blog-sections-minimal-blog): A clean list of post titles, dates, and excerpts set in plenty of space. Use it for a writing focused blog where the words carry the whole page. `npx shadcn@latest add https://shadcn.exchange/r/shadcn-ui-blocks/marketing-blog-sections-minimal-blog.json`
- [Podcast List by @shadcn-ui-blocks](https://shadcn.exchange/r/shadcn-ui-blocks/marketing-blog-sections-podcast-list): A list of episode cards with cover art, titles, and play controls. Use it to publish a podcast feed where listeners browse and start episodes. `npx shadcn@latest add https://shadcn.exchange/r/shadcn-ui-blocks/marketing-blog-sections-podcast-list.json`
- [Minimal List Dates by @shadcn-ui-blocks](https://shadcn.exchange/r/shadcn-ui-blocks/portfolio-portfolio-blog-writing-and-previews-minimal-list-dates): A plain text list of post titles with publish dates beside each one. Use it when you want a fast, distraction free archive of all your writing. `npx shadcn@latest add https://shadcn.exchange/r/shadcn-ui-blocks/portfolio-portfolio-blog-writing-and-previews-minimal-list-dates.json`
- [Expert Roundup by @shadcn-ui-blocks](https://shadcn.exchange/r/shadcn-ui-blocks/marketing-blog-sections-expert-roundup): A grid collecting quotes and headshots from several contributors. Use it to package an opinion roundup or panel feature into one shareable post. `npx shadcn@latest add https://shadcn.exchange/r/shadcn-ui-blocks/marketing-blog-sections-expert-roundup.json`
- [Category Filter by @shadcn-ui-blocks](https://shadcn.exchange/r/shadcn-ui-blocks/marketing-blog-sections-category-filter): A post grid paired with category tabs that filter the visible articles. Use it to help readers narrow a busy blog down to the topics they want. `npx shadcn@latest add https://shadcn.exchange/r/shadcn-ui-blocks/marketing-blog-sections-category-filter.json`
- [Magazine Layout by @shadcn-ui-blocks](https://shadcn.exchange/r/shadcn-ui-blocks/marketing-blog-sections-magazine-layout): An editorial grid that mixes large and small story cards across columns. Use it to give a content heavy blog the dense feel of a print magazine. `npx shadcn@latest add https://shadcn.exchange/r/shadcn-ui-blocks/marketing-blog-sections-magazine-layout.json`
- [Carousel by @shadcn-ui-blocks](https://shadcn.exchange/r/shadcn-ui-blocks/marketing-blog-sections-carousel): A horizontal slider of article cards with cover images and titles. Use it to feature recent or popular posts in a compact strip readers can swipe. `npx shadcn@latest add https://shadcn.exchange/r/shadcn-ui-blocks/marketing-blog-sections-carousel.json`
- [Masonry Layout Articles by @shadcn-ui-blocks](https://shadcn.exchange/r/shadcn-ui-blocks/portfolio-portfolio-blog-writing-and-previews-masonry-layout-articles): A masonry grid of article cards with varied heights for a dynamic feel. Fits posts that mix tall images with short text on a writing showcase. `npx shadcn@latest add https://shadcn.exchange/r/shadcn-ui-blocks/portfolio-portfolio-blog-writing-and-previews-masonry-layout-articles.json`
- [Interview Format by @shadcn-ui-blocks](https://shadcn.exchange/r/shadcn-ui-blocks/marketing-blog-sections-interview-format): A question and answer layout with a guest portrait and intro. Use it to publish interviews in a clear, readable format on an editorial blog. `npx shadcn@latest add https://shadcn.exchange/r/shadcn-ui-blocks/marketing-blog-sections-interview-format.json`
- [Timeline Blog by @shadcn-ui-blocks](https://shadcn.exchange/r/shadcn-ui-blocks/marketing-blog-sections-timeline-blog): A vertical timeline that orders posts by date with markers and dots. Use it for a changelog, release notes, or a chronological story archive. `npx shadcn@latest add https://shadcn.exchange/r/shadcn-ui-blocks/marketing-blog-sections-timeline-blog.json`

## Paid blog blocks

The first 60 of 249, best first. Their registries sell these: each installs from its registry once bought.

- [Blog 09 - Card-Style Blog Layout by @shadcn-space](https://shadcn.exchange/r/shadcn-space/blog-09): A clean card-based layout highlighting a main story with supporting articles, helping users discover content quickly and navigate through insights with ease.
- [Blog Section 2 by @initium](https://shadcn.exchange/r/initium/blog-section-2): Blog posts section 2 with avatars, cards, three-column grid, background contrast section.
- [Blogs 5 by @efferd](https://shadcn.exchange/r/efferd/blogs-5): Magazine layout with featured post.
- [Blog 02 - Latest Articles by @shadcn-space](https://shadcn.exchange/r/shadcn-space/blog-02): A modern blog section designed to highlight recent articles, insights, and updates with structured cards—helping teams share knowledge, boost engagement, and establish thought leadership.
- [Blog Post Page 1 by @initium](https://shadcn.exchange/r/initium/blog-post-page-1): Blog post page example section 1 with site links and legal, primary and secondary CTAs, navigation links.
- [Blogs 4 by @efferd](https://shadcn.exchange/r/efferd/blogs-4): Bento-style grid with spanning items.
- [Blog 06 - Featured Blog by @shadcn-space](https://shadcn.exchange/r/shadcn-space/blog-06): A clean card-based blog section highlighting recent updates, insights, and resources to keep users informed with the latest content.
- [Blog Page 3 by @initium](https://shadcn.exchange/r/initium/blog-page-3): Blog page example section 3 with site links and legal, primary and secondary CTAs, navigation links.
- [Blog 03 - Editorial Blog by @shadcn-space](https://shadcn.exchange/r/shadcn-space/blog-03): A clean editorial-style blog layout designed to showcase featured stories with balanced visuals and summaries, helping brands share expertise, inspire readers, and strengthen content presence.
- [Blog Section 3 by @initium](https://shadcn.exchange/r/initium/blog-section-3): Blog posts section 3 with cards, media, three-column grid, background contrast section, video aspect media.
- [Blog 05 - News Grid by @shadcn-space](https://shadcn.exchange/r/shadcn-space/blog-05): A modern blog grid crafted to showcase recent articles with engaging visuals and metadata, helping teams promote fresh content, improve discoverability, and keep audiences informed.
- [Blog Post Page 3 by @initium](https://shadcn.exchange/r/initium/blog-post-page-3): Blog post page example section 3 with site links and legal, primary and secondary CTAs, navigation links.
- [Blog 07 - Modern Architecture Blog by @shadcn-space](https://shadcn.exchange/r/shadcn-space/blog-07): A clean blog layout featuring design stories, ideas, and insights, helping users stay inspired and explore modern living in a simple way.
- [Blog Section 5 by @initium](https://shadcn.exchange/r/initium/blog-section-5): Blog posts section 5 with avatars, media, background contrast section.
- [Blog 08 - Team Insights Blog by @shadcn-space](https://shadcn.exchange/r/shadcn-space/blog-08): A minimal blog layout featuring team experiences, collaboration tips, and work insights, helping users improve communication, stay productive, and work better together.
- [Blog Section 4 by @initium](https://shadcn.exchange/r/initium/blog-section-4): Blog posts section 4 with cards, media, two-column layout, bento-style grid, background contrast section.
- [Blog Page 1 by @initium](https://shadcn.exchange/r/initium/blog-page-1): Blog page example section 1 with site links and legal, primary and secondary CTAs, navigation links.
- [Blog Section 6 by @initium](https://shadcn.exchange/r/initium/blog-section-6): Blog posts section 6 with cards, media, bento-style grid, background contrast section, video aspect media.
- [Blog Page 2 by @initium](https://shadcn.exchange/r/initium/blog-page-2): Blog page example section 2 with site links and legal, primary and secondary CTAs, navigation links.
- [Blog Post Page 2 by @initium](https://shadcn.exchange/r/initium/blog-post-page-2): Blog post page example section 2 with site links and legal, primary and secondary CTAs, navigation links.
- [Blog Section 1 by @initium](https://shadcn.exchange/r/initium/blog-section-1): Blog posts section 1 with media, three-column grid, centered content, background contrast section, video aspect media.
- [Blog Section 3 by @shadcnstore](https://shadcn.exchange/r/shadcnstore/blog-section-3): A horizontal scrollable stories grid with gradient borders and avatars.
- [Blog Listing 2 – Paginated card grid by @shadcncraft](https://shadcn.exchange/r/shadcncraft/blog-listing-2): A card-based blog layout with a clear section header and a progressive "Load more" pattern. Uses consistent post cards with image, category, title, meta, and author, designed to scale as content grows. Suitable for blog index pages or home…
- [Blog Magazine by @blockforge](https://shadcn.exchange/r/blockforge/blog-magazine): Journal front page: one featured story, ruled sections.
- [Simple blog with grid by @aceternity](https://shadcn.exchange/r/aceternity/simple-blog-with-grid): Simple Blog With Grid.
- [Blog Section 2 by @shadcnstore](https://shadcn.exchange/r/shadcnstore/blog-section-2): A grid of recent blog posts with images, titles, authors, and tags.
- [Blog Listing 3 – Featured lead with supporting grid by @shadcncraft](https://shadcn.exchange/r/shadcncraft/blog-listing-3): A blog layout anchored by a large featured post followed by a compact card grid. Emphasizes editorial hierarchy by spotlighting a primary article, then surfacing recent or related posts underneath. Works well for blog homepages where one s…
- [Blog Featured Grid by @blockforge](https://shadcn.exchange/r/blockforge/blog-featured-grid): One lead story with three compact posts beside it.
- [Blog content centered by @aceternity](https://shadcn.exchange/r/aceternity/blog-content-centered): Blog Content Centered.
- [Blog Section 4 by @shadcnstore](https://shadcn.exchange/r/shadcnstore/blog-section-4): A responsive grid layout featuring news cards with images, titles, and metadata.
- [Blog Listing 1 – Featured grid by @shadcncraft](https://shadcn.exchange/r/shadcncraft/blog-listing-1): A responsive blog listing that highlights recent posts in a clean card grid. Includes category, title, read time, author, and date, with a clear section header and optional "See all" action. Works well for homepages or content hubs where y…
- [Blog with categories by @aceternity](https://shadcn.exchange/r/aceternity/blog-with-categories): Blog listing with three featured cards and a denser four-column grid below, category labels on each post.
- [Blog Listing 4 – Dense editorial grid by @shadcncraft](https://shadcn.exchange/r/shadcncraft/blog-listing-4): A high-density card grid that surfaces many posts at once with equal visual weight. Uses consistent card sizing and rhythm to support fast scanning and browsing. Best for archive pages or content hubs where breadth and discovery matter mor…
- [Blog content with toc by @aceternity](https://shadcn.exchange/r/aceternity/blog-content-with-toc): Blog Content With Toc.
- [Blog with search magazine by @aceternity](https://shadcn.exchange/r/aceternity/blog-with-search-magazine): Blog With Search — magazine layout with cover story and card grid.
- [Blog with search by @aceternity](https://shadcn.exchange/r/aceternity/blog-with-search): Blog With Search.
- [Blog Blocks 4 by @tailark](https://shadcn.exchange/r/tailark/blog-blocks-4): Tailark blog-blocks variant 4 block.
- [Blog Blocks 7 by @tailark](https://shadcn.exchange/r/tailark/blog-blocks-7): Tailark blog-blocks variant 7 block.
- [Blog Blocks 2 by @tailark](https://shadcn.exchange/r/tailark/blog-blocks-2): Tailark blog-blocks variant 2 block.
- [Blog Blocks 6 by @tailark](https://shadcn.exchange/r/tailark/blog-blocks-6): Tailark blog-blocks variant 6 block.
- [Blog Blocks 5 by @tailark](https://shadcn.exchange/r/tailark/blog-blocks-5): Tailark blog-blocks variant 5 block.
- [Blog Blocks 3 by @tailark](https://shadcn.exchange/r/tailark/blog-blocks-3): Tailark blog-blocks variant 3 block.
- [Blog Blocks 1 by @tailark](https://shadcn.exchange/r/tailark/blog-blocks-1): Tailark blog-blocks variant 1 block.
- [Newsroom Masonry by @beste-ui](https://shadcn.exchange/r/beste-ui/blog52): A CSS-columns masonry of linked newsroom cards under a parenthetical eyebrow and a large heading, where the image aspect ratio cycles by position so the wall keeps an uneven, magazine-like rhythm.
- [Blog by @shadcnuikit](https://shadcn.exchange/r/shadcnuikit/blog-card4): Blog built with shadcn/ui.
- [Blog 96 - Paginated blog post grid by @shadcnblocks](https://shadcn.exchange/r/shadcnblocks/blog96): Three-column blog post grid showing six cards per page with numbered pagination, previous and next controls, ellipsis for long archives, and a live showing-range label.
- [Blog post detail page with gradient overlay image hero, byline, pull quote, and related posts list by @reui](https://shadcn.exchange/r/reui/blog-5): Reading page for one blog post, news, changelog, or case study. Cover with gradient scrim, overlaid title and category badge, byline, sections, pull quote, author bio, and text-only related posts. Uses shadcn Card, AspectRatio, Avatar, Bad…
- [Magazine Mosaic by @beste-ui](https://shadcn.exchange/r/beste-ui/blog50): A six-slot magazine mosaic with a parenthetical eyebrow and a large heading, pairing a dominant two-by-two tile with a tall tile, wide tiles, and unit tiles that each caption their photo over a graded scrim.
- [Blog by @shadcnuikit](https://shadcn.exchange/r/shadcnuikit/blog-card3): Reusable card layouts for articles and blog posts, with header image, title, excerpt, author, and read-more actions. Built with shadcn/ui so you can drop them into grids or lists on landing pages and dashboards.
- [Blog 66 - Text-only blog post cards with read link by @shadcnblocks](https://shadcn.exchange/r/shadcnblocks/blog66): Text-only blog post cards with a title, excerpt, and read cue, each card one link that gains a muted fill on hover, in a three-column grid.
- [Blog index with cover-image post cards in a responsive three-column grid and author footers by @reui](https://shadcn.exchange/r/reui/blog-1): Blog listing on a responsive 1/2/3-column grid of Cards: 16:10 cover, date and read-time, clamped title and excerpt, author footer with Avatar and Read link. Built on Card, CardContent, Avatar. For blog index, article archive, news, or cha…
- [Press Release Wall by @beste-ui](https://shadcn.exchange/r/beste-ui/blog55): A three-column wall of image-free press release cards on soft muted surfaces under a parenthetical eyebrow and a large heading, each card pairing a release type and date with a headline, dek, byline, and a ruled category row.
- [Blog by @shadcnuikit](https://shadcn.exchange/r/shadcnuikit/blog-card1): Reusable card layouts for articles and blog posts, with header image, title, excerpt, author, and read-more actions. Built with shadcn/ui so you can drop them into grids or lists on landing pages and dashboards.
- [Blogpost 14 - Article footer with tags and comments by @shadcnblocks](https://shadcn.exchange/r/shadcnblocks/blogpost14): End-of-article section with filed-under tags, previous and next article links, a working comment form, and threaded comments with likes and replies.
- [Single-column blog post detail page with breadcrumb, author byline, topic badges, Read Next grid by @reui](https://shadcn.exchange/r/reui/blog-6): Centered max-w-3xl blog post detail page: breadcrumb, headline, author byline, cover image, body sections, topic badges, and a two-up Read Next grid of related posts. Uses shadcn Breadcrumb, Card, Item, Avatar, Badge, Separator. For releas…
- [Topic Hub Card With Resource List by @beste-ui](https://shadcn.exchange/r/beste-ui/blog63): A topic hub card whose left third is a photo panel with the topic title set on a scrim over it, next to a two-column body: a short summary on one side and the posts belonging to the topic listed by title alone on the other.
- [Blog by @shadcnuikit](https://shadcn.exchange/r/shadcnuikit/blog-card2): Reusable card layouts for articles and blog posts, with header image, title, excerpt, author, and read-more actions. Built with shadcn/ui so you can drop them into grids or lists on landing pages and dashboards.
- [Blog 63 - Text-only blog post cards with author footer by @shadcnblocks](https://shadcn.exchange/r/shadcnblocks/blog63): Bordered blog post cards with a title, corner arrow, excerpt, and a ruled footer with author avatar and read time, in a three-column grid.
- [Blog article carousel with cover cards, circular prev/next controls and a progress-line indicator by @reui](https://shadcn.exchange/r/reui/blog-3): Featured-article blog carousel with circular prev/next buttons and a 1px progress line as position indicator. Cover scales on hover; category badge and read time. shadcn Carousel, Progress, AspectRatio, Badge, Card. Article slider, feature…
- [Polaroid Photo Gallery by @beste-ui](https://shadcn.exchange/r/beste-ui/blog26): Playful polaroid-style cards with random rotations and white borders. Cards straighten on hover for a fun, casual photo gallery feel.

For the rest, page through `https://shadcn.exchange/api/catalog?kind=blocks&category=blog&price=paid`.

## Registries with the most blog blocks

- [@shadcnblocks](https://shadcn.exchange/r/shadcnblocks): 159 blocks, 5 free and 154 paid
- [@beste-ui](https://shadcn.exchange/r/beste-ui): 43 blocks, 1 free and 42 paid
- [@shadcn-ui-blocks](https://shadcn.exchange/r/shadcn-ui-blocks): 22 blocks, all free
- [@initium](https://shadcn.exchange/r/initium): 12 blocks, all paid
- [@7ovr](https://shadcn.exchange/r/7ovr): 9 blocks, all free
- [@shadcn-space](https://shadcn.exchange/r/shadcn-space): 9 blocks, 2 free and 7 paid
- [@tailark](https://shadcn.exchange/r/tailark): 7 blocks, all paid
- [@aceternity](https://shadcn.exchange/r/aceternity): 6 blocks, all paid
- [@reui](https://shadcn.exchange/r/reui): 6 blocks, all paid
- [@shadcnui-blocks](https://shadcn.exchange/r/shadcnui-blocks): 6 blocks, all free
- [@efferd](https://shadcn.exchange/r/efferd): 5 blocks, 3 free and 2 paid
- [@nusaiba](https://shadcn.exchange/r/nusaiba): 5 blocks, all free
- [@blockforge](https://shadcn.exchange/r/blockforge): 4 blocks, 2 free and 2 paid
- [@shadcncraft](https://shadcn.exchange/r/shadcncraft): 4 blocks, all paid
- [@shadcnstore](https://shadcn.exchange/r/shadcnstore): 4 blocks, 1 free and 3 paid
- [@shadcnuikit](https://shadcn.exchange/r/shadcnuikit): 4 blocks, all paid
- [@uitripled](https://shadcn.exchange/r/uitripled): 4 blocks, all free
- [@shadcn-studio](https://shadcn.exchange/r/shadcn-studio): 3 blocks, all free
- [@ballmac](https://shadcn.exchange/r/ballmac): 2 blocks, all free
- [@heyompatil](https://shadcn.exchange/r/heyompatil): 2 blocks, all free