Case Study Card

Highlighted case study with metric, quote, and company attribution.

Preview

Case study

Design system rollout

How a four-person team consolidated three codebases into one shared component library.

Dev time saved

40%

Time to launch

3 weeks

Read the case study
Design system rollout

Installation

terminal
$
Other package managers
bunx --bun shadcn@latest add https://trents.tech/r/case-study-card.json

Usage

case-study-card-demo.tsx
import CaseStudyCard from "@/components/blocks/case-study-card"

export default function CaseStudyCardDemo() {
  return (
    <CaseStudyCard
      // Customize the case study copy, metrics, and image.
      title="Design system rollout"
      summary="How a four-person team consolidated three codebases into one shared component library."
      category="Case study"
      imageUrl="https://images.unsplash.com/photo-1461749280684-dccba630e2f6?auto=format&fit=crop&w=1200&q=80"
      metrics={[
        { label: "Dev time saved", value: "40%" },
        { label: "Time to launch", value: "3 weeks" },
      ]}
      href="/docs"
    />
  )
}
0