frontend▌

Build production-quality user interfaces that are accessible, performant, and visually polished.

"Transform Figma designs into implementation-ready specifications with pixel-perfect accuracy"

Design intuitive, accessible, user-centered interfaces.

Frontend development patterns, performance optimization, and automation tools for React/Next.js applications.

Apply these rules when writing or reviewing Next.js code.

SvelteKit routing, layouts, error handling, and SSR structure guidance. \n \n File-based routing with +page.svelte for pages, +layout.svelte for nested wrappers, +error.svelte for error boundaries, and +server.ts for API endpoints \n Nested layouts apply to all child routes; use route groups with (name) folders to organize without affecting URLs \n Error boundaries and pending UI patterns via +error.svelte placement and svelte:boundary component-level error/pending states \n SSR and hydration gu

This skill contains the complete design system for Claude's built-in show_widget tool — the generative UI feature that renders interactive HTML/SVG widgets inline in claude.ai conversations. The guidelines below are the actual Anthropic "Imagine — Visual Creation Suite" design rules, extracted so you can produce high-quality widgets directly without needing the read_me setup call.

Establish design token hierarchies, theming infrastructure, and component architecture for scalable design systems. \n \n Covers three-layer token organization: primitive tokens (raw values), semantic tokens (contextual meaning), and component tokens (specific usage) \n Includes theme switching patterns with CSS custom properties, React context providers, system preference detection, and persistent storage \n Provides component architecture patterns including compound components, polymorphic var

Establish consistency and best practices across backend microservices (blog-api, auth-service, notifications-service) using modern Node.js/Express/TypeScript patterns.

Use this skill for system-level design decisions rather than implementation details within a single service or component.