Labsco
vercel logo

building-components

โœ“ Officialโ˜… 776

by vercel ยท part of vercel/components.build

Guide for building modern, accessible, and composable UI components. Use when building new components, implementing accessibility, creating composable APIs, setting up design tokens, publishing to npm/registry, or writing component documentation.

๐Ÿ”ฅ๐Ÿ”ฅ๐Ÿ”ฅ๐Ÿ”ฅโœ“ VerifiedFreeQuick setup
๐Ÿงฐ Not standalone. This skill ships with vercel/components.build and only works together with that tool โ€” install the tool first, then add this skill.

This is the playbook your agent receives when the skill activates โ€” you don't need to read it to use the skill, but it's here to audit before installing.

Building Components

When to use this skill

Use when the user is:

  • Building new UI components (primitives, components, blocks, templates)
  • Implementing accessibility features (ARIA, keyboard navigation, focus management)
  • Creating composable component APIs (slots, render props, controlled/uncontrolled state)
  • Setting up design tokens and theming systems
  • Publishing components to npm or a registry
  • Writing component documentation
  • Implementing polymorphism or as-child patterns
  • Working with data attributes for styling/state

References