# Compléter le color picker avec palette

**URL:** <https://community.gladysassistant.com/t/completer-le-color-picker-avec-palette/7678>\
**Category:** Demandes livrées\
**Tags:** feature-core\
**Created:** [Novembre 14, 2022, 4:13 UTC](https://community.gladysassistant.com/t/completer-le-color-picker-avec-palette/7678 "2022-11-14T16:13:50Z")\
**Posts on this page:** 10\
**Page:** 1

<div class="post-metadata">

**Author:** ![guim31](https://gladys-assistant-community.b-cdn.net/user_avatar/community.gladysassistant.com/guim31/32/4840_2.png) [@guim31](https://community.gladysassistant.com/u/guim31)\
**Post date:** [Novembre 14, 2022, 4:13 UTC](https://community.gladysassistant.com/t/completer-le-color-picker-avec-palette/7678/1 "2022-11-14T16:13:50Z")

</div>

Actuellement nous nous servons du nuancier ci dessous pour choisir la couleur d’une ampoule.

 ![image](https://gladys-assistant-community.b-cdn.net/uploads/default/original/2X/c/ced0dce674af92b10d467f685d150729afc12f76.png)

Le problème est qu’il est difficile de choisir de manière fiable la couleur souhaitée. Pour cela il faudrait compléter le nuancier par une palette, avec l’exemple de zigbee2mqtt qui affiche ceci :

 ![image](https://gladys-assistant-community.b-cdn.net/uploads/default/original/2X/d/d54bba49c6c5205866dda2820f673ffba04eba2e.png)

Une palette de couleurs «&nbsp;basiques&nbsp;» complétées de blanc froid / blanc neutre / blanc chaud + le color picker

Qu’en dites-vous ?

---

<div class="post-metadata">

**Author:** ![Tlse-vins](https://gladys-assistant-community.b-cdn.net/user_avatar/community.gladysassistant.com/tlse-vins/32/6054_2.png) [@Tlse-vins](https://community.gladysassistant.com/u/Tlse-vins)\
**Post date:** [Novembre 14, 2022, 5:34 UTC](https://community.gladysassistant.com/t/completer-le-color-picker-avec-palette/7678/2 "2022-11-14T17:34:39Z")

</div>

J’ai retrouvé une discussion qui date du début de la V4.

> [@Parlons de Gladys V4](https://community.gladysassistant.com/t/parlons-de-gladys-v4/3578/661):
>
> Grâce à la sortie de la beta, j’ai eu plein de retours concernant le service Philips Hue et je suis entrain d’ajouter des compatibilités supplémentaires! 3 utilisateurs (@Hamtaro, @Aldo et @Dahu) m’ont envoyés leur liste de Philips Hue avec toutes les informations dont j’ai besoin pour intégrer leurs lampes. Au niveau de l’UI, je regarder pour ajouter un color-picker, et je suis tombé sur plusieurs lib plutôt sympa: [https://casesandberg.github.io/react-color/](https://casesandberg.github.io/react-color/) Ce que je me demande, c’est “e…

---

<div class="post-metadata">

**Author:** ![Tlse-vins](https://gladys-assistant-community.b-cdn.net/user_avatar/community.gladysassistant.com/tlse-vins/32/6054_2.png) [@Tlse-vins](https://community.gladysassistant.com/u/Tlse-vins)\
**Post date:** [Décembre 4, 2022, 8:40 UTC](https://community.gladysassistant.com/t/completer-le-color-picker-avec-palette/7678/3 "2022-12-04T20:40:10Z")

</div>

C’est très basique mais dans l’interface de zigbee2mqtt, voici ce qu’il y a:

 ![Capture panel colors](https://gladys-assistant-community.b-cdn.net/uploads/default/original/2X/0/0470375e3f7af6d075baec225daaa129e55d8690.png)

Edit: oups je n’avais pas fait attention au message précèdent.

---

<div class="post-metadata">

**Author:** ![Will\_71](https://gladys-assistant-community.b-cdn.net/user_avatar/community.gladysassistant.com/will_71/32/9582_2.png) [@Will\_71](https://community.gladysassistant.com/u/Will_71)\
**Post date:** [Juillet 11, 2026, 8:10 UTC](https://community.gladysassistant.com/t/completer-le-color-picker-avec-palette/7678/4 "2026-07-11T20:10:02Z")

</div>

J’ai un peu travaillé sur le sujet.

Est-ce que cela peut correspondre aux attentes ? Et j’ai modifié aussi pour avoir les vraies couleurs dans le thème sombre.

 ![image](https://gladys-assistant-community.b-cdn.net/uploads/default/original/3X/0/1/0110e78ecd51945461a3978958143737d464d52a.png)

---

<div class="post-metadata">

**Author:** ![Will\_71](https://gladys-assistant-community.b-cdn.net/user_avatar/community.gladysassistant.com/will_71/32/9582_2.png) [@Will\_71](https://community.gladysassistant.com/u/Will_71)\
**Post date:** [Juillet 12, 2026, 11:53 UTC](https://community.gladysassistant.com/t/completer-le-color-picker-avec-palette/7678/5 "2026-07-12T11:53:16Z")

</div>

@pierre-gilles, j’avais pas vu mais tu as déjà ouvert une PR à ce sujet. Pour l’instant je n’avance pas plus.

N’oublie pas de prendre en compte d’afficher les vraies couleurs en thème sombre.

> <https://github.com/GladysAssistant/Gladys/pull/2615>
>
> \### Description
> 
> Implémente la fonctionnalité demandée sur le forum : \[Compléter… le color picker avec palette\](https://community.gladysassistant.com/t/completer-le-color-picker-avec-palette/7678).
> 
> Le sélecteur de couleur des ampoules (roue iro) est désormais complété par une palette de couleurs prédéfinies, inspirée de l'interface zigbee2mqtt :
> 
> \- \*\*8 couleurs de base\*\* : rouge, orange, jaune, vert, aqua, bleu, violet, rose
> \- \*\*3 blancs\*\* : blanc froid (6500K), blanc neutre (4000K), blanc chaud (2700K)
> \- La roue de couleur reste disponible pour un réglage fin
> 
> \### Changements
> 
> \- Nouveau composant partagé \`ColorPalette\` utilisé dans :
> - le contrôle couleur des boxs appareils du dashboard (\`ColorDeviceFeature\`)
> - l'éditeur de scènes (\`ColorPicker\`)
> \- Constantes de palette centralisées dans \`front/src/utils/colorPalette.js\`
> \- Traductions ajoutées (en, fr, de) pour les libellés des blancs
> \- Correction du clic hors popover dans \`ColorDeviceFeature\` pour ne pas fermer le picker lors d'un clic sur la palette
> 
> \### Check-list
> 
> \- \[x\] Linter front OK (\`npm run eslint\`)
> \- \[x\] Prettier OK (\`npm run prettier-check\`)
> \- \[x\] Traductions synchronisées (\`npm run compare-translations\`)
> \- \[x\] Build front OK (\`npm run build\`)
> \- \[\] Testé avec un appareil réel
> 
> Closes https://community.gladysassistant.com/t/completer-le-color-picker-avec-palette/7678
> 
> 
> \<div\>\<a href="https://cursor.com/agents/bc-019f2969-ad6e-7ec1-9c90-10735becaf20"\>\<picture\>\<source media="(prefers-color-scheme: dark)" srcset="https://cursor.com/assets/images/open-in-web-dark.png"\>\<source media="(prefers-color-scheme: light)" srcset="https://cursor.com/assets/images/open-in-web-light.png"\>\<img alt="Open in Web" width="114" height="28" src="https://cursor.com/assets/images/open-in-web-dark.png"\>\</picture\>\</a\>&nbsp;\<a href="https://cursor.com/background-agent?bcId=bc-019f2969-ad6e-7ec1-9c90-10735becaf20"\>\<picture\>\<source media="(prefers-color-scheme: dark)" srcset="https://cursor.com/assets/images/open-in-cursor-dark.png"\>\<source media="(prefers-color-scheme: light)" srcset="https://cursor.com/assets/images/open-in-cursor-light.png"\>\<img alt="Open in Cursor" width="131" height="28" src="https://cursor.com/assets/images/open-in-cursor-dark.png"\>\</picture\>\</a\>&nbsp;\</div\>

---

<div class="post-metadata">

**Author:** ![guim31](https://gladys-assistant-community.b-cdn.net/user_avatar/community.gladysassistant.com/guim31/32/4840_2.png) [@guim31](https://community.gladysassistant.com/u/guim31)\
**Post date:** [Juillet 12, 2026, 4:24 UTC](https://community.gladysassistant.com/t/completer-le-color-picker-avec-palette/7678/6 "2026-07-12T16:24:53Z")

</div>

Je sais que j’en avais déjà parlé, mais pourrait-on imaginer une palette classique + une palette avec juste les températures de couleurs (la température du blanc en fait) ?  
-froid  
-neutre  
-chaud

On le voit sur la capture de @Tlse-vins juste au dessus

---

<div class="post-metadata">

**Author:** ![pierre-gilles](https://gladys-assistant-community.b-cdn.net/user_avatar/community.gladysassistant.com/pierre-gilles/32/5886_2.png) [@pierre-gilles](https://community.gladysassistant.com/u/pierre-gilles)\
**Post date:** [Juillet 13, 2026, 7:57 UTC](https://community.gladysassistant.com/t/completer-le-color-picker-avec-palette/7678/7 "2026-07-13T07:57:55Z")

</div>

> [@Will\_71](#):
>
> @pierre-gilles, j’avais pas vu mais tu as déjà ouvert une PR à ce sujet. Pour l’instant je n’avance pas plus.

J’avais lancé Cursor sur le sujet, mais je n’ai pas encore testé la PR, donc le plus dur reste à faire 😉 Si tu veux tester/améliorer, tu peux reprendre le travail fait par Cursor et demander à ton IA de corriger !

> [@guim31](#):
>
> mais pourrait-on imaginer une palette classique + une palette avec juste les températures de couleurs (la température du blanc en fait) ?

Bonne idée, après en général c’est une fonctionnalité différentes sur les appareils («&nbsp;Température de couleur&nbsp;» vs «&nbsp;Couleur&nbsp;»)

---

<div class="post-metadata">

**Author:** ![guim31](https://gladys-assistant-community.b-cdn.net/user_avatar/community.gladysassistant.com/guim31/32/4840_2.png) [@guim31](https://community.gladysassistant.com/u/guim31)\
**Post date:** [Juillet 13, 2026, 6:19 UTC](https://community.gladysassistant.com/t/completer-le-color-picker-avec-palette/7678/8 "2026-07-13T18:19:20Z")

</div>

> [@pierre-gilles](#):
>
> Bonne idée, après en général c’est une fonctionnalité différentes sur les appareils (« Température de couleur » vs « Couleur »)

Oui absolument, je ne sais pas ce que cela implique coté code de Gladys.  
Mais comme ces features vont régulièrement de paire, je pense qu’il faut penser à développer les deux, et qu’un appareil qui gère les 2 features en soit doté 😉

---

<div class="post-metadata">

**Author:** ![cursor-bot](https://gladys-assistant-community.b-cdn.net/user_avatar/community.gladysassistant.com/cursor-bot/32/22252_2.png) [@cursor-bot](https://community.gladysassistant.com/u/cursor-bot)\
**Post date:** [Octobre 29, 2026, 10:39 UTC](https://community.gladysassistant.com/t/completer-le-color-picker-avec-palette/7678/9 "2026-10-29T10:39:16Z")

</div>

Salut @guim31 !

Le panneau lumière du widget appareil a une palette, depuis Gladys 5.0.

Tu as 10 couleurs prédéfinies, dont le blanc chaud, en plus du nuancier. Si l’ampoule gère la température de couleur, un curseur est là aussi : tu choisis un blanc froid, neutre ou chaud sans viser un point précis sur le disque.

Je range ce sujet dans « Demandes livrées ». S’il reste un cas qui ne correspond pas, ouvre un nouveau sujet : ce sera plus simple à suivre.

---

<div class="post-metadata">

**Author:** ![cursor-bot](https://gladys-assistant-community.b-cdn.net/user_avatar/community.gladysassistant.com/cursor-bot/32/22252_2.png) [@cursor-bot](https://community.gladysassistant.com/u/cursor-bot)\
**Post date:** [Octobre 29, 2026, 10:54 UTC](https://community.gladysassistant.com/t/completer-le-color-picker-avec-palette/7678/10 "2026-10-29T10:54:30Z")

</div>