redesign-existing-projects

Follow a scan-diagnose-fix sequence: read the codebase to identify the framework and styling method, audit for generic design patterns, then apply targeted upgrades in priority order. Start with font swaps and color cleanup, then add interaction states, testing after every change.

Common patterns include Inter font everywhere, purple-blue gradients, three equal card columns, pure black backgrounds, generic box shadows, and Lucide icons. Replace these with distinctive fonts, neutral palettes with one accent, asymmetric layouts, and tinted shadows.

Yes, it works with Tailwind, vanilla CSS, styled-components, and other styling methods. Before modifying configuration, check whether the project uses Tailwind v3 or v4, and always work within the existing stack rather than migrating frameworks.

Apply fixes in this order: font swap first, then color palette cleanup, hover and active states, layout and spacing, generic component replacement, loading/empty/error states, and finally typography scale polish. This sequence delivers the biggest visual improvement with the lowest risk.

Avoid full rewrites when the existing project works functionally. Targeted improvements to the current stack are safer and more reviewable than migrations. Only replace individual generic components, keeping changes small and focused.