Comment créer un curseur de varation de lumière avec icone et scènes

Bonjour,

Je fais appel à votre aide :blush: J’ai cherché comment faire mais sans succès.

J’aimerai créer pour mes lumières un curseur avec icone et valeur comme sur l’image ci-dessus avec en prime à côté une bulle permettant d’accéder aux différentes scènes lumineuses. Je trouve ca hyper propre et pratique.
J’utilise dèjà un système de tuile avec curseur circulaire mais pas très pratique selon moi.
Merci à vous


Tu peux le faire avec la card mushroom-light:

et pour les scènes utilise la card chip de mushroom:

pour avoir le slide + les chips pour les scène, il faut utiliser une card vertical et/ou horizontal
horizontale :

verticale :

il y a d’autre manière de faire, exemple la button-card mais plus complexe à mettre en place ou encore button-entity-card:

1 « J'aime »

Merci à toi pour cette solution plus que complète :wink:
J’avais déjà le package mushroom d’installer. Hors à ce jour je n’ai pas réussi à faire mieux que cela même si sur l’idée, on s’en rapproche.
Je ne parviens pas à faire en sorte que le slide prenne l’intégralité de la card et y ajouter l’icone.
Peut être en modifiant le code?

Bonjour. J’ai justement fait ça il y a peu.

type: custom:vertical-stack-in-card
cards:
  - type: custom:mushroom-light-card
    entity: light.yeelight_strip6_0x13f2ab10
    icon: mdi:led-strip-variant
    use_light_color: true
    show_brightness_control: true
    show_color_temp_control: true
    collapsible_controls: true
    name: Meuble TV
    show_color_control: true
  - type: conditional
    conditions:
      - condition: state
        entity: light.yeelight_strip6_0x13f2ab10
        state: "on"
    card:
      type: custom:mushroom-chips-card
      chips:
        - type: action
          icon_color: red
          tap_action:
            action: perform-action
            perform_action: light.turn_on
            target:
              entity_id: light.yeelight_strip6_0x13f2ab10
            data:
              rgb_color:
                - 255
                - 0
                - 0
              brightness_pct: 5
          hold_action:
            action: none
          icon: mdi:checkbox-blank-circle
        - type: action
          icon_color: deep-orange
          tap_action:
            action: perform-action
            perform_action: light.turn_on
            target:
              entity_id: light.yeelight_strip6_0x13f2ab10
            data:
              brightness_pct: 5
              kelvin: 2500
          hold_action:
            action: none
          icon: mdi:checkbox-blank-circle
        - type: action
          icon_color: orange
          tap_action:
            action: perform-action
            perform_action: light.turn_on
            target:
              entity_id: light.yeelight_strip6_0x13f2ab10
            data:
              brightness_pct: 30
              kelvin: 2700
          hold_action:
            action: none
          icon: mdi:checkbox-blank-circle
        - type: action
          icon_color: amber
          tap_action:
            action: perform-action
            perform_action: light.turn_on
            target:
              entity_id: light.yeelight_strip6_0x13f2ab10
            data:
              brightness_pct: 50
              kelvin: 3000
          hold_action:
            action: none
          icon: mdi:checkbox-blank-circle
        - type: action
          icon_color: light-grey
          tap_action:
            action: perform-action
            perform_action: light.turn_on
            target:
              entity_id: light.yeelight_strip6_0x13f2ab10
            data:
              brightness_pct: 70
              kelvin: 4000
          hold_action:
            action: none
          icon: mdi:checkbox-blank-circle
        - type: action
          icon_color: white
          tap_action:
            action: perform-action
            perform_action: light.turn_on
            target:
              entity_id: light.yeelight_strip6_0x13f2ab10
            data:
              brightness_pct: 100
              kelvin: 5000
          hold_action:
            action: none
          icon: mdi:checkbox-blank-circle
      alignment: justify

Faute de réussir à tout intégrer sur une seule ligne (prends moins de place sur les dashboards), je suis partis sur une button-card pour le nom/icone et une card Mushroom Light pour la partie curseur

Sinon avec ça : GitHub - Clooos/Bubble-Card: Bubble Card is a minimalist card collection for Home Assistant with a nice pop-up touch.

Ca semble clairement répondre à ce que je cherchais :star_struck:
Je teste et je te redis. Merci :grin:

1 « J'aime »

Tu peux avec ce code obtenir quelque chose de très petit.

type: custom:mushroom-light-card
entity: light.cuisine_plafond
use_light_color: true
show_brightness_control: true
collapsible_controls: true
hold_action:
  action: more-info
double_tap_action:
  action: none
primary_info: name
name: Plafond
card_mod:
  style:
    mushroom-shape-icon$: |
      .shape {
        border: 2.5px outset green
        }
    mushroom-light-brightness-control$:
      mushroom-slider$: |
        .slider {
          height: 5px !important;
        }
    .: |
      mushroom-light-brightness-control {
        height: 10px;
      }

image

image