Champ Color

Le champ color stocke une valeur de couleur controlee dans une ligne de repeater.

Ideal pour

• couleurs de badge
• pastilles d'accent
• valeurs de legende de graphique
• tokens visuels simples par item

Exemple de schema

{ "name": "accentColor", "label": "Accent Color", "type": "color" }

Usage dans le template

{{#each stats as="item"}}
  <span class="stat-dot" style="background-color: {{ item.accentColor }};"></span>
{{/each}}

Exemple de variante :

{{#each badges as="item"}}
  <span class="badge" style="border-color: {{ item.accentColor }};">
    {{ item.label }}
  </span>
{{/each}}

Quand l'utiliser

Utilisez color lorsque chaque item repete a besoin d'une valeur visuelle legere que les editeurs peuvent controler en securite.

Quand ne pas l'utiliser

N'utilisez pas color lorsque :

• la couleur doit etre imposee globalement par des design tokens
• la valeur devrait etre choisie dans un petit ensemble nomme plutot que via une entree de couleur libre

Utilisez plutot select ou un systeme de styling partage.

Notes techniques

• gardez color dans des structures repetees controlees, pas comme substitut a des design tokens globaux
• utilisez-le quand la variation au niveau item est intentionnelle et limitee
• preferez des variantes nommees via select lorsque la coherence compte plus qu'un libre choix de couleur
• revoyez l'impact accessibilite avant de vous appuyer uniquement sur la couleur pour transmettre du sens

Related

• Repeater
• Select
• Range