Media Keys

Row of tactile transport keycaps with the center play/pause lit in primary, flanked by track name and elapsed time.

Porcelain · Moby

2:18 / 4:01

Requires shadcn/ui initialized. Run npx shadcn@latest init if you haven't.

Import & use

import { Keyboard16 } from "@/components/beste/piece/keyboard16";

<Keyboard16
  state="playing"
  track="Porcelain · Moby"
  elapsed="2:18 / 4:01"
/>