ColorPalette4Me
Une image, une palette, prête à coder
Présentation
ColorPalette4Me transforme n'importe quelle image en palette propre et directement exploitable dans ton code. Une image entre, ta palette sort — rampes complètes, contrastes vérifiés et exports prêts à coller. Le tout 100% dans ton navigateur : ton image ne quitte jamais ta machine.
Le problème
Tu as un visuel inspirant et tu veux en tirer une palette pour ton projet. Les extracteurs classiques te crachent 5 hex bruts — et après ? Il faut générer les nuances à la main, vérifier chaque contraste un par un, retaper tout ça dans ton tailwind.config. Du boulot répétitif entre l'inspiration et le code.
Ce que ça fait
Tu déposes une image (photo, screenshot, moodboard). L'app extrait les couleurs dominantes en local, génère une rampe complète 50→950 pour chacune, vérifie les contrastes WCAG, te montre le rendu live sur un mini-mockup d'UI, et te livre les fichiers prêts à coller dans ta stack.
Fonctionnalités
- Extraction 100% client-side — l'image est lue en mémoire navigateur (Canvas API), rien n'est uploadé (argument privacy fort)
- Regroupement perceptuel — quantification en espace OKLCH pour des couleurs cohérentes, de 3 à 10 couleurs réglables
- Swatches multi-format — valeurs HEX / RGB / HSL / OKLCH, copie au clic, réordonnancement au glisser
- Rampe complète 50→950 — calibrée façon palette Tailwind officielle pour chaque couleur de base
- Contraste WCAG — badge AA / AAA avec ratio affiché sur chaque paire texte/fond
- Aperçu live — un mini-mockup d'UI (bouton, carte, titre, texte, lien) qui applique ta palette en temps réel
- Exports prêts à coller —
tailwind.config.js, variables CSS:root, design tokens JSON (compatible Figma), fichier.aseAdobe
Pour qui
Devs front, designers, créateurs de SaaS et freelances qui partent d'une image ou d'un moodboard et veulent une palette directement branchable dans leur stack (Tailwind, CSS, Figma).
Stack
Laravel + Livewire pour la coquille, mais toute l'extraction et tous les exports sont 100% client-side (Canvas API + Alpine.js + lib couleur type culori pour l'OKLCH). Aucun upload serveur, aucun compte, zéro coût API.