Frontend Dev

Overview

Use this skill to build, extend, debug, and review professional React web frontends where shadcn/ui (https://github.com/shadcn-ui/ui) is the default component system.

The single most important thing to internalize: shadcn/ui is not a runtime dependency. It is a CLI that copies accessible, Radix-based component source into the project (typically components/ui/ or src/components/ui/). Once copied, those files belong to the project and are meant to be read and edited. Treating shadcn/ui like a normal npm component library — installing a shadcn-ui package, never touching the generated files, or reinstalling to "upgrade" — is the most common and most damaging mistake. Build on the copied source; do not fight it.

This skill covers shadcn/ui specifically. For non-shadcn UI, native desktop toolkits, or game UIs, see the boundaries in "When Not To Use".