Audit and refine React/Next.js UI components for WCAG 2.1 AA accessibility and mobile-first responsiveness.
npx skills add https://github.com/Uncodier/API --skill ui-ux-design-uncodier
Please help me install this Agent Skill. Skill: ui-ux-design Source: https://github.com/Uncodier/API/tree/main/src/skills/ui-ux-design Command: npx skills add https://github.com/Uncodier/API --skill ui-ux-design-uncodier
UI/UX inconsistencies, accessibility gaps, and non-responsive layouts hinder user experience and increase maintenance. This skill standardizes design practice across projects, ensuring clear hierarchy, accessible markup, and mobile-first responsiveness.
Use Case: Audit and refine dashboards, forms, and product pages for consistency and accessibility.
Start by auditing the current UI for accessibility and hierarchy, then implement responsive, WCAG-compliant components using the project design system.
High-intent search queries and answers about installing and using this skill.
To meet WCAG 2.1 AA accessibility standards, your web app components need semantic HTML, proper alt text, keyboard navigation, and clear visual hierarchy. This skill audits and refines UI elements to enforce these guidelines.
Auditing a dashboard for responsive design involves checking mobile-first layouts using CSS Grid and Flexbox. This skill evaluates visual hierarchy and responsive behavior to identify inconsistencies across pages and forms.
The best way to enforce a design system in React and Next.js is by standardizing typography, visual hierarchy, and component structure. This skill applies these design system rules to produce consistent, performance-conscious markup.
Yes, you can fix accessibility gaps in existing forms and product pages by auditing current UI elements and applying WCAG 2.1 AA conformance. This skill refines semantic HTML and keyboard navigation for better usability.
No specific dependencies are required to generate accessible UI components, as the skill operates independently. It focuses on applying relative units, semantic HTML, and accessible imagery directly within your React or Next.js environment.
Your UI layout breaks on mobile screens when mobile-first responsive principles and relative units are not properly applied. This skill audits and corrects CSS Grid and Flexbox structures to ensure consistent behavior across devices.
stancodevStandardize mobile UI component development with design tokens for Next.js/React projects.
matteocervelliIdentify and report WCAG 2.1 Level AA accessibility violations on web pages.
efekrbasDesign Tailwind CSS design systems with semantic tokens and accessible variants.
BrunoAMSilvaInspect and fix layout, accessibility and UI consistency issues in web applications.
