frontend-accessibility

Implement accessible UI components following WCAG guidelines in Next.js and React applications. Use this skill when creating or modifying React components (*.tsx), working with Radix UI or Headless UI primitives, implementing keyboard navigation, adding ARIA attributes, managing focus states in modals/dialogs, creating form inputs with proper labels, building navigation menus, implementing skip links, or ensuring color contrast compliance. This includes files in apps/blog/src/components/, packages/ui/src/primitives/, packages/ui/src/components/, and any component using @headlessui/react or @radix-ui/* packages. Apply when working with interactive elements like buttons, links, dropdowns, dialogs, or any focusable elements.