shadcn/ui publishes ~50 components. In the Opus 4.7 corpus, a handful do nearly all the work.

The top 20 by usage

Component Imports Files using
button 14,824 14,794
card 7,536 7,534
badge 6,602 6,602
input 6,275 6,267
label 3,952 3,950
textarea 2,242 2,242
skeleton 1,713 1,709
select 1,280 1,280
separator 1,183 1,179
dialog 1,169 1,151
tabs 1,130 1,129
switch 901 901
avatar 786 786
checkbox 744 744
scroll-area 648 648
progress 583 583
tooltip 492 490
table 474 474
alert 427 427
popover 335 335

The Four Horsemen

Button (14,824) + Card (7,536) + Badge (6,602) + Input (6,275) = 35,237 imports — more than the next 16 components combined. If you had to pick four shadcn primitives that cover 80% of Opus 4.7’s UI needs, these are them.

The median Opus 4.7 repo imports Button ~1.7 times, Card ~0.9 times. Every single repo with shadcn/ui installed reaches for Button almost immediately.

The long tail

Below the top 20, the drop-off is steep. Components like carousel, pagination, hover-card, context-menu, menubar, navigation-menu each appear in under 200 repos. These are specialty tools — they exist, they work, but Opus 4.7 doesn’t reach for them by default.

The PascalCase anomaly

Something interesting in the data: both @/components/ui/button (14,824) and @/components/ui/Button (1,059) appear. shadcn’s canonical filenames are lowercase. The PascalCase variant is non-canonical — roughly 7% of repos have it, probably because the model auto-renamed during refactor or because the user prefers PascalCase components.

Same pattern for Card/Input/Badge/Toast. This is a real sign: Opus 4.7 sometimes deviates from shadcn’s file naming conventions, and that deviation propagates across multiple files in the same repo.

Loading states are baked in

Skeleton is ranked 7th (1,713 uses). For reference, that’s roughly the same volume as select and dialog. Opus 4.7 defaults to skeleton-based loading UI — not spinners, not empty states. This is the React Server Component / Suspense era style.

Forms: label + input + textarea + select + checkbox + switch = 14,194

Sum the form-adjacent components: label (3,952) + input (6,275) + textarea (2,242) + select (1,280) + checkbox (744) + switch (901) = 15,394 imports.

That’s only slightly less than button (14,824). Forms are half the UI work in Opus 4.7 repos. Hence the heavy Zod + React Hook Form adoption.

Practical implication

If you’re building a scaffold generator for the Opus 4.7 aesthetic:

  1. Always scaffold the Four Horsemen first — Button, Card, Badge, Input. Every repo needs them.
  2. Add Label + Textarea + Select as a second batch — forms need these.
  3. Include Skeleton — 14% of repos use it; cheaper to scaffold than retrofit.
  4. Stick to lowercase filenames — that’s the shadcn canonical; PascalCase is drift.

And crucially: don’t scaffold every shadcn primitive. Scaffold the top 15, leave the rest for on-demand npx shadcn add invocations. That keeps the repo small and matches the corpus distribution.


Related: The shadcn/ui Dominance in Opus 4.7.