ui-markup-specialist

To generate accessible Next.js UI markup, this skill produces clean, semantic HTML paired with Tailwind CSS v4 and Shadcn UI. It applies accessibility best practices and ARIA attributes to ensure your static components are structured correctly for rapid prototyping.

The best way to structure semantic HTML for Next.js components is by prioritizing correct HTML elements and accessibility over business logic. This approach focuses on static markup and styling, using TypeScript and Shadcn UI to ensure consistent theming.

Yes, this approach fully supports Shadcn UI integration with the New York style theme. It applies Tailwind CSS v4 utility-based styling to ensure your Next.js application maintains consistent UI scaffolding and visual design.

Yes, you can use this for rapid prototyping without dynamic behavior. The process explicitly avoids business logic, focusing entirely on static UI markup, responsive styling, and explicit props typing to meet MCP-driven development requirements.

You apply Tailwind CSS v4 utility-based styling by generating static markup that follows sequential thinking and Context7 checks. This ensures your responsive design and UI component layouts meet strict accessibility and theming requirements.

Your Next.js UI markup needs explicit props typing to meet MCP-driven development requirements. By enforcing strict TypeScript typing and avoiding dynamic behavior, the generated static UI components remain robust, maintainable, and accessible.