Frontend Design Fix Skill

Overview

This orchestrator skill diagnoses generic design patterns and applies targeted aesthetic upgrades across five design dimensions. Fixes are tech-agnostic (principles) but reference framework-specific implementation skills.

The 5 Dimensions:

1. Typography – Replace generic fonts, fix weight hierarchies, aggressive size jumps
2. Color & Theme – Remove predictable palettes, introduce CSS variables, add dominant + accent strategy
3. Motion – Add orchestrated page loads, staggered reveals, hover surprises
4. Spatial Composition – Break centered layouts, introduce asymmetry, adjust spacing strategy
5. Backgrounds & Details – Layer gradients, add geometric patterns, create atmospheric depth

Quick Diagnosis

"What's wrong with my design?"