taste-redesign

name

taste-redesign

description

Upgrades existing UIs to premium quality by auditing generic AI patterns and applying high-end design standards. Use when UI looks flat, generic, or "AI-slop". Triggers on: "improve the design", "looks generic", "not polished enough", "redesign this", "elevate the UI", "it looks boring", "make it better looking", "apply taste", "design review". Works with any CSS framework. Source: github.com/leonxlnx/taste-skill (redesign-skill variant).

Taste Redesign Skill

Apply changes in this order for maximum visual impact with minimum risk:

1. Font swap — biggest instant improvement
2. Color palette cleanup — remove clashing or oversaturated colors
3. Hover and active states — makes the interface feel alive
4. Layout and spacing — proper grid, max-width, consistent padding
5. Replace generic components — swap cliché patterns for modern alternatives
6. Add loading, empty, and error states — makes it feel finished
7. Polish typography scale and spacing — the premium final touch

Audit Checklist

Typography

• Replace generic fonts (Inter, Roboto, Arial) with distinctive alternatives: Geist, Outfit, Cabinet Grotesk
• Tighten letter-spacing on headlines, reduce line-height — headlines should feel heavy
• Limit paragraph width to ~65 characters, increase line-height for readability
• Introduce Medium (500) and SemiBold (600) weights
• Use font-variant-numeric: tabular-nums for data-heavy interfaces
• Fix orphaned words with text-wrap: balance or text-wrap: pretty
• Use sentence case, not Title Case, on headers

Color and Surfaces

• Avoid pure black — use off-black or tinted dark variants