redesign-existing-projects

Audit the current design against a checklist of generic patterns, then apply targeted fixes in priority order: font swap, color cleanup, hover states, layout, components, and states. Test after every change and keep improvements small and reviewable rather than rewriting from scratch.

Replace default fonts like Inter with characterful alternatives, remove purple-blue AI gradients, break three-equal-card layouts into asymmetric grids, and add missing hover, loading, empty, and error states. Tint shadows to match backgrounds and add subtle grain or texture.

Yes, it works with Tailwind, vanilla CSS, styled-components, or any styling method. Before modifying Tailwind configuration, check whether the project uses v3 or v4, since config formats differ between versions.

The most common patterns are Inter font everywhere, purple-blue gradients, three equal feature cards, pure black backgrounds, Lucide icons, generic box-shadows, and AI copywriting cliches like "Elevate" or "Seamless". Each has a concrete replacement in the audit checklist.

Avoid it when the project needs a full rebrand with a new identity system, or when the underlying code is too broken to preserve. The skill explicitly avoids framework migrations and large rewrites, so greenfield redesigns need a different approach.