<Card title="Site visitors (last 30 days)">
<Chart type="line" x="Day" y="Visitors" title="Visitors over time">
| Day | Visitors |
|---|---|
| 1 | 1200 |
| 2 | 1150 |
| 3 | 1300 |
| 4 | 1250 |
| 5 | 1400 |
</Chart>
<Stat label="Total visitors" value="37,800" change="+" tone="info" />
</Card>

<Card title="Conversion rate">
<Stat label="Conversion rate" value="3.5%" change="+" tone="success" />
</Card>

<Card title="Top traffic sources">
<Chart type="pie" x="Source" y="Share" title="Traffic source share">
| Source | Share |
|---|---|
| Homepage | 35% |
| Paid Search | 25% |
| Organic Search | 20% |
| Social | 12% |
| Direct | 8% |
</Chart>
<Stat label="Total sessions" value="98,765" tone="info" />
</Card>

<Card title="Running campaigns">
<Chart type="column" x="Campaign" y="Spend" title="Campaign spend">
| Campaign | Spend |
|---|---|
| Summer Sale | $15,000 |
| Holiday Promo | $12,000 |
| New Product Launch | $10,000 |
| Blog Boost | $8,000 |
| Seasonal Discount | $5,000 |
</Chart>
<Callout tone="success" title="Best performing campaign">
<Stat label="Highest spend" value="$15,000" change="" tone="success" />
</Callout>
</Card>

<Card title="Email subscriber growth">
<Stat label="Subscribers this month" value="2,340" change="+12%" tone="success" />
<Progress value="75" max="100" label="Growth" tone="info" />
</Card>

<Form name="report-filter">
<Date label="Date range" name="date-range" hint="Select start and end dates" required="false" />
<Button variant="primary" href="#" label="Export report" size="medium" />
</Form>