## CPU Monitor (S—382)

Per-core CPU load as live bars with sparklines, load averages, a pause button, and a stress test to watch it spike.

- URL: https://sundaeui.dev/components/cpu-monitor
- Category: Cards & data visualization · Art direction: Refined
- Access: Sundae Pro (authenticated install)
- Stack: React 18+, TypeScript, plain CSS; dependencies: none
- Install: `npx shadcn@latest add https://sundaeui.dev/r/cpu-monitor.json`
- Tags: cores, devops, monitor, system, sparkline, cpu

Each core shows its current load and the last twenty samples. The header carries the overall average and 1, 5 and 15 minute load figures.
Pause freezes the readings for a closer look; Stress ramps every core towards full and lets it settle back. Sort puts the busiest cores first.

### Usage

```tsx
import { CpuMonitor } from '@/components/sundae/cpu-monitor'

<CpuMonitor />
```

### Props

- `cores` (`number`, default `8`): Number of cores.
- `interval` (`number`, default `900`): Sample interval, ms.
- `fill` (`'dark' | 'light'`, default `'dark'`): Surface: dark or light.

### When to use

- Server dashboards, dev tools, system panels.

### When not to use

- Machines with dozens of cores: aggregate instead.

### Accessibility

- Each core is a meter with a numeric value.
- Controls are labelled toggles; samples are not announced.
- Reduced motion removes the movement and keeps every state change.