Skill UI

This skill guides the development of robust, security-focused full-stack web applications. It ensures layered security coverage across the entire application stack, from database queries (parameterized queries) to API endpoints (authentication/authorization) and frontend components (input validation, output encoding). Use this when building end-to-end features, microservices, or REST APIs that require simultaneous attention to Frontend, Backend, and Security best practices.

This comprehensive guide helps developers select and implement optimal Vercel architecture blueprints based on project scale and complexity. It covers five validated patterns, ranging from simple static JAMstack sites and robust full-stack SaaS applications, to advanced multi-zone micro-frontend enterprise deployments. Use this resource when planning new deployments, optimizing scaling strategies, or structuring complex monorepos.

Analyzes diverse codebases to auto-detect technology stacks, microservices/monorepo traits, and frontend presence, then documents consistent folder conventions, visualization options, and template guidance to keep large projects organized.

This skill provides advanced architectural guidelines for generating premium, award-level web experiences. It guides code generation beyond basic HTML/CSS, focusing on creating immersive digital environments. Key areas include sophisticated motion design (scroll-driven narratives, micro-interactions), establishing strong visual identities (e.g., Brutalism, Glassmorphism), and enforcing strict performance best practices like hardware acceleration and accessibility compliance.

This skill provides expert guidance on design engineering, focusing on UI polish, micro-interactions, and high-craft component decisions. It is ideal for reviewing frontend code (React, CSS, Tailwind) to elevate perceived quality, addressing details like easing, duration, and physical feedback. Use it when subtle detail and refined taste are critical differentiators.