redesign-existing-projects

Audit and upgrade existing website UI without changing its framework.

Updated Feb 24, 2026
One-click install
npx skills add https://github.com/FrekiManagarm/dunlo --skill redesign-existing-projects-frekimanagarm
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: redesign-existing-projects
Source: https://github.com/FrekiManagarm/dunlo/tree/main/.agents/skills/redesign-existing-projects
Command: npx skills add https://github.com/FrekiManagarm/dunlo --skill redesign-existing-projects-frekimanagarm

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill fixes generic, AI-looking, low-polish UI by auditing an existing codebase and applying premium design upgrades without breaking functionality.

Core Features & Use Cases

  • Design audit and diagnosis: Identifies typography, color/surface, layout, interactivity, content, component patterns, iconography, and code-quality issues that create a “template” or “AI fingerprint” look.
  • Targeted, stack-safe fixes: Improves the current design using the existing CSS/framework approach (Tailwind, vanilla CSS, styled components, etc.) rather than migrating to a new system.
  • Production-minded quality checklist: Adds missing states like hover/active, focus rings, loading, empty, and error views to make the product feel complete.

Quick Start

Apply the redesign flow to your current project by scanning the UI implementation, running the design audit checklist, then applying only targeted changes that keep the existing stack and functionality intact.

Frequently Asked Questions about redesign-existing-projects

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I improve UI design quality in an existing app without breaking functionality?

To improve UI design quality without breaking functionality, a scan-diagnose-fix workflow audits your current interface and applies targeted visual upgrades. This approach preserves your existing CSS framework and logic while enhancing typography, layout, and interactivity.

What is a design audit checklist for fixing generic-looking UI?

A design audit checklist for generic-looking UI evaluates typography, color surfaces, layout, component patterns, and interactivity. It identifies template-like or AI-generated fingerprints and missing interaction states, ensuring your product feels complete and premium.

Can I polish front-end UI in a production app without migrating CSS frameworks?

Yes, you can polish front-end UI without migrating CSS frameworks. Stack-preserving changes apply targeted fixes directly to your existing setup, whether you use Tailwind, vanilla CSS, or styled components, keeping your current architecture intact.

How do I add missing interaction states like hover and focus rings to an existing codebase?

Adding missing interaction states like hover, active, focus rings, loading, empty, and error views requires auditing your current components. A production-minded quality checklist identifies these gaps and applies targeted CSS updates to make the product feel complete.

What is the best way to fix low-polish typography and layout in a web app?

The best way to fix low-polish typography and layout is running a targeted diagnostic scan on your existing codebase. This identifies visual hierarchy issues and applies stack-safe fixes to elevate the design without requiring a full rewrite.

Why does my app still look like an AI-generated template after styling?

Your app might look like an AI-generated template due to generic component patterns, poor visual hierarchy, and missing interaction states. A design audit diagnoses these specific code-quality and interactivity issues to apply premium, targeted fixes.