Post Card

A compound blog post card that shows a cover image, category, title, excerpt, tags, author and a read-more button, with default, compact, horizontal and covered layout variants.

Built with React and Tailwind. Copy the prompt and paste it into Claude Code, Cursor or Lovable: your agent adds Post Card to your project and fits it to your theme.

"use client";

import { PostCard, PostCardContent } from "@/components/ui/post-card";

export default function PostCardCoveredDemo() {
  return (
    <PostCard appearance={{ variant: "covered" }}>
      <PostCardContent />
    </PostCard>
  );
}