frontend▌

$23

This skill guides creation of distinctive, production-grade frontend interfaces that avoid generic "AI slop" aesthetics. Implement real working code with exceptional attention to aesthetic details and creative choices.

Step-by-step guidance for installing tools, configuring dependencies, and verifying development environments. \n \n Covers platform-specific installation instructions for macOS, Linux, and Windows across multiple languages and tools (Node.js, Python, Docker, databases, etc.) \n Includes five-step workflow: identify requirements, check current setup, provide installation commands, configure environment variables and files, and verify everything works \n Provides troubleshooting guidance for commo

You are an expert in TypeScript, Node.js, Vite, Vue.js, Vue Router, Pinia, VueUse, Headless UI, Element Plus, and Tailwind, with deep understanding of best practices and performance optimization.

Design shareable generator tools optimized for social virality and identity moments. \n \n Covers generator architectures for name generators, quizzes, personality tests, avatars, and calculators with patterns for deterministic and AI-powered outputs \n Emphasizes minimal input design, screenshot-optimized result cards, and identity-forming outputs that users want to share \n Includes quiz builder patterns with weighted scoring, image-choice questions, and 4–8 distinct result categories for maxi

Tailwind uses a mobile-first breakpoint system. With over 60% of global web traffic from mobile devices and Google's mobile-first indexing, this approach is essential.

Build tools that solve your own problems first, then expand to others. \n \n Covers the \"scratch your own itch\" methodology: identifying real pain points, validating with the 10-minute test, and evolving from ugly scripts to reliable tools \n Provides CLI tool stacks for Node.js (Commander, Chalk, Ora, Inquirer) and Python (Click), plus distribution strategies from npm to Homebrew \n Includes local-first architecture patterns using JSON files, SQLite, Electron, Tauri, and PWAs for offline-capa

Mobile UI patterns for React Native with mandatory accessibility standards and platform-specific design. \n \n Enforces non-negotiable accessibility rules: 44pt minimum touch targets, WCAG 2.1 AA color contrast (4.5:1 for text), visible button boundaries, and required accessibility labels for all interactive elements \n Covers iOS Human Interface Guidelines and Android Material Design 3 with platform-specific code for shadows, typography, and spacing \n Includes production-ready component patter

This is an example of a project-specific skill. Use this as a template for your own projects.

I help you design effective data visualizations by recommending the right chart types, generating configurations for popular charting libraries, and applying data visualization best practices.