code-generation Prompts
Dark Mode Implementation Guide
Generates a complete dark mode implementation with theme tokens, toggle component, system preference detection, persistence, smooth transitions, and image adaptation for your frontend stack.
Browser Compatibility Fix Generator
Identifies browser compatibility issues in your frontend code and generates cross-browser fixes with polyfills, fallbacks, and progressive enhancement patterns for your target browser matrix.
Micro-Frontend Architecture Planner
Generates a complete micro-frontend architecture plan with module federation configuration, shared dependency management, routing strategy, communication patterns, and deployment pipeline design.
Storybook Configuration and Story Writer
Generates complete Storybook configuration, story files with all variants, interactive controls, documentation pages, and visual testing setup for your component library.
Component Unit Testing Template Generator
Generates comprehensive unit testing templates for frontend components with testing patterns for user interactions, async behavior, accessibility checks, and snapshot testing in your chosen testing framework.
Progressive Web App Scaffold Generator
Generates a complete PWA implementation including service worker, web app manifest, offline fallback, caching strategies, push notification setup, and install prompt handling.
Internationalization Setup Guide Generator
Generates a complete i18n implementation with routing, translation file structure, pluralization, date/number formatting, and RTL support for your framework and locale requirements.
SVG Animation and Illustration Generator
Generates optimized SVG illustrations with CSS or SMIL animations, including path morphing, draw-on effects, and interactive states for icons, logos, and decorative elements.
Design System Token Generator
Generates a complete design token system with color scales, typography, spacing, elevation, and motion tokens in multiple output formats for seamless design-to-code handoff.
Frontend Performance Bundle Analyzer and Optimizer
Analyzes your frontend bundle configuration, identifies performance bottlenecks, and generates specific optimization strategies with code changes for tree-shaking, code splitting, and lazy loading.
Form Validation System Builder
Generates a complete form validation system with schema definitions, real-time validation, accessible error messages, and multi-step form support for your chosen framework and validation library.
SSR vs SSG Migration Guide Generator
Generates a detailed migration guide for transitioning between server-side rendering and static site generation strategies, with framework-specific code changes, performance comparisons, and step-by-step implementation.