jal-coCommunity·7 Agent Skills Included

ui

Build polished React components with shadcn registry distribution

Builds production-ready React and Tailwind components with accessible structure, clean composition, and restrained styling. Removes guesswork around variants, file structure, dependencies, and registry metadata when shipping public UI components. Guides the full workflow from component design through docs, previews, and shadcn-compatible registry publishing.

143|1

↗

npx skills add jal-co/ui --all -g -y

Available:

Instructs your AI agent on the repository's component quality bar and routes each task to the correct sub-skill for building, documenting, or publishing registry components.

All Skills in This Repository (7)

Pure Emerald Level Indicators

📦 In Repo

jal-co

jalco-writing-component-docs

Generate and review jalco UI component documentation against format specifications.

frontend-design

Generate distinctive frontend interfaces with custom typography and cohesive color themes.

jalco-component-builder

Guide UI component creation, refinement, and review within the jalco-ui library.

vercel-react-best-practices

Optimize React and Next.js applications with performance rules for waterfalls and bundle size.

vercel-composition-patterns

Guide React component composition with compound components and context providers.

tailwind-design-system

Configure Tailwind CSS v4 design tokens and component variants with CSS-first patterns.

jalco-shadcn-registry

Create and maintain shadcn-compatible registry items for the jalco ui library.

Community

Advanced

Frequently Asked Questions

FAQPage Schema

How to install jal-co/ui?▼

Run `npx skills add jal-co/ui --all -g -y` in your terminal to install all skills in this suite globally.

What does jal-co/ui help me build?▼

It helps you create polished, accessible React and Tailwind components with strong defaults, meaningful variants, and docs that ship alongside the code.

How do I publish components to a shadcn registry?▼

The registry skills walk you through choosing item types, editing registry.json, validating dependencies, and building installable payloads compatible with the shadcn CLI.

Does it enforce accessibility and performance standards?▼

Yes. Built-in rules cover keyboard navigation, ARIA, focus management, bundle size, and React rendering performance based on Vercel engineering guidelines.

Can I use these skills without deep React expertise?▼

Yes. Your AI agent follows the step-by-step workflows and checklists, so you describe the component you want in plain English and it handles the engineering details.