rosalina7515/ui-modernizer

ui-modernizer is a Skill for Claude Code, the AI coding tool from Anthropic. Once installed, a developer can open a project built with React, Vue, or Svelte plus Tailwind CSS, type 'modernize this UI' inside Claude Code, and the agent will rewrite the visual layer so the project looks like a modern 2026 web app. The user can pick a style by adding a name to the prompt, such as 'modernize this UI like Linear' or 'modernize this UI like Stripe'. Seven built-in profiles are shipped, including Vercel, shadcn, Notion, Raycast, and Apple, and the user can also point at a local Markdown file that describes their own brand. Installation is one command, 'npx ui-modernizer', and the Skill becomes available in every project the user opens with Claude Code afterwards. There is no external API call: the work happens locally, and the user's code never leaves the machine. The README is explicit about what the tool will and will not touch. It edits Tailwind class strings, layout wrapper elements in an additive way, the global CSS file, and the Tailwind config. It does not touch event handlers, state, fetches, server actions, or component signatures. Every run follows the same six steps: detect the stack, plan the file changes, back up every modified file under a timestamped folder, apply the rules, write a report file with per-file additions and deletions, and finish. A single 'npx ui-modernizer rollback' command undoes the run from the backup folder. The Skill can also auto-install shadcn primitive components if asked. It scans for hand-rolled buttons, inputs, badges, and cards, runs the shadcn add command for what it needs, and rewrites the markup to use the new components while keeping every event handler, ref, and aria attribute in place. Supported stacks include React with Next.js, Vue 3 with Nuxt or Vite, and Svelte 5 with SvelteKit or Vite, on Tailwind v3 or v4. Styled-components and CSS Modules are out of scope. The roadmap lists features already shipped through version 1.0 and ideas for later releases, such as a VS Code plugin, a Figma-to-code path, and React Native support.