Frontend & UI

redesign-existing-projects

Audite un site existant et le fait progresser sans casser ses fonctionnalités.

De quoi il s’agit

Un workflow de scan, diagnostic et correction pour projets existants. Il audite la typo, la couleur, la mise en page, les états, le contenu, les icônes et la qualité du code, puis applique des améliorations ciblées dans la stack en place.

Upgrades existing websites and apps to premium quality. Audits current design, identifies generic AI patterns, and applies high-end design standards without breaking functionality. Works with any CSS framework or vanilla
Depuis le SKILL.md en amont

Pourquoi ça compte pour le design

  • Les dégradés IA violet-bleu et les trois rangées de cartes égales sont remplacés par des alternatives réfléchies.
  • Les boutons d’un groupe de cartes s’alignent sur une seule ligne basse, malgré des contenus variés.
  • Les états manquants de survol, focus, chargement, vide et erreur sont complétés.

Ce que ça couvre

  • How this works
  • Design audit
  • Upgrade techniques
  • Fix priority
  • Rules

Comment l’installer

redesign-existing-projects

  1. Clonez le dépôt.

    git clone https://github.com/Leonxlnx/taste-skill
  2. Pointez Codex sur le fichier du skill.

    skills/redesign-skill/SKILL.md
  3. Décrivez ensuite l’interface voulue. Codex suit le skill.

Comment le faire tourner avec Codex

  1. Il scanne d’abord la base de code pour identifier le framework et la méthode de style.

  2. Il liste chaque pattern générique et chaque point faible avant de toucher à quoi que ce soit.

  3. Les corrections arrivent par ordre de priorité : polices, couleur, états, mise en page, composants, finition typo.

Chaque plugin présenté ici est gratuit, open source, et renvoie à sa vraie source amont.

En savoir plus sur la liste codex-design ↗

Prochaine étape

Designez avec Open Design, sans la config

Installez ce plugin vous-même, ou faites tourner toute une couche design sélectionnée autour de Codex avec Open Design. Apportez votre clé, gardez la main sur ce que vous produisez.

Open Design Desktop

Un seul design system. Votre marque, cohérente partout

Dans le Vibe Design Workspace complet, appliquez les mêmes règles de marque aux sites, slides, prototypes interactifs, dashboards, images et vidéos HTML. Connectez Codex, Claude Code, Cursor et vos autres agents de code locaux, puis créez gratuitement.

  • Sites, slides, prototypes, dashboards, images et vidéos
  • Plus de 140 design systems et la bibliothèque complète de modèles et skills
  • Codex local et plus de 21 agents de code · Gratuit
Télécharger gratuitement

Disponible sur macOS, Windows et Linux