---
title: "Card Content Header"
description: "Card Content Header with sizes and variants"
source: "Equality"
---
import {
  CardContentHeader,
  Card,
  CardContent,
  CardDescription,
} from "@eqtylab/equality";

## Variants

### Default

<CardContent client:only="react">
  <CardContentHeader
    icon="SquareChartGantt"
    heading="Activity Logs"
    onButtonClick={() => {}}
  />
</CardContent>

### Inside Card

<Card client:only="react">
  <CardContent className="space-y-2">
    <CardContentHeader
      icon="SquareChartGantt"
      heading="Activity Logs"
      onButtonClick={() => {}}
    />
    <CardDescription>Card with CardContentHeader</CardDescription>
  </CardContent>
</Card>