blog pattern

Tag page

Posts filtered by tag.

When to use it

/blog/tags/{tag} for taxonomies.

  • Show all posts under the tag
  • Quick swap to another tag

Layout regions

  • header
  • hero
  • all-tags
  • posts

States

  • default
  • empty

Example

<Container><h1>Posts tagged <Tag variant="static">{tag}</Tag></h1><Grid>{posts.map((p) => <PostCard key={p.slug} {...p} />)}</Grid></Container>

The full Tag page pattern specifies 1 exact microcopy string, 1 motion spec, 3 composition rules — all gated behind the full recipe. Get the full recipe.

Build the Tag page pattern in your project.