Skip to content

A dazzling custom card for controlling SignalRGB through Home Assistant

License

Notifications You must be signed in to change notification settings

hyperb1iss/hyper-light-card

Repository files navigation

🌟 hyper-light-card for Home Assistant

HACS Custom GitHub Release License

A dazzling custom card for controlling SignalRGB through Home Assistant

InstallationConfigurationUsageContributingLicense

✨ Features

  • 💅 Sleek, modern design that adapts to your SignalRGB effects
  • 🎨 Dynamic color palette based on the current effect
  • 📱 Responsive layout for both desktop and mobile
  • 🔀 Easy effect switching with a dropdown menu
  • 💡 Intuitive on/off toggle
  • 🔆 Brightness control slider
  • ℹ️ Detailed effect information display
  • 🔧 Customizable card appearance
  • 🎛️ Effect parameter display

🌈 Screenshots

🛠️ Installation

Prerequisites

HACS Installation (Recommended)

  1. Make sure you have HACS installed in your Home Assistant instance.
  2. Go to HACS → Frontend → "+ Explore & Download Repositories"
  3. Search for "hyper-light-card" and add it.
  4. Refresh your browser cache by holding down Ctrl and pressing F5.

NOTE: This component isn't in the official HACS repository yet. You can add it as a custom repository for now- go to HACS, click on the 3 dots, click custom repositories, and enter "hyperb1iss/hyper-light-card" for the repository and select "Lovelace" for the category.

Manual Installation

  1. Download hyper-light-card.js from the latest release.

  2. Copy it into your config/www directory.

  3. Add the following to your configuration.yaml:

    lovelace:
      resources:
        - url: /local/hyper-light-card.js
          type: module
  4. Restart Home Assistant.

⚙️ Configuration

Add the card to your dashboard:

  1. Edit your dashboard
  2. Click "+ Add Card"
  3. Search for "Hyper Light Card" in Custom Cards
  4. Choose your SignalRGB entity

Or add it manually to your Lovelace configuration:

type: custom:hyper-light-card
entity: light.signalrgb
name: "All The RGBeez"
icon: mdi:led-strip-variant
show_effect_info: true
show_effect_parameters: true
show_brightness_control: true
background_opacity: 0.7
allowed_effects:
  - "Lava Lamp"
  - "Bubbles"
  - "Rave Visualizer"

Configuration Options

Option Type Default Description
entity string Required The entity_id of your SignalRGB light
name string friendly_name of entity Card title
icon string mdi:led-strip-variant Icon to display
show_effect_info boolean true Show effect description and publisher
show_effect_parameters boolean true Display effect parameters
show_brightness_control boolean true Display brightness slider
background_opacity number 0.7 Opacity of the effect image background (0-1)
allowed_effects string[] undefined List of effects to show in the dropdown. If not set, all effects will be shown.

🚀 Usage

hyper-light-card provides an intuitive interface for controlling your SignalRGB setup:

  • Power Toggle: Click the switch to turn your SignalRGB setup on or off.
  • Effect Selection: Use the dropdown to choose from available effects.
  • Brightness Control: Adjust the brightness using the slider (if enabled).
  • Effect Info: View the current effect's description and publisher (if enabled).
  • Effect Parameters: See detailed parameters for the current effect (if enabled).

The card dynamically adapts its color scheme based on the current effect, creating a cohesive and stylish look for your dashboard.

🤝 Contributing

Contributions are what make the open-source community such a fantastic place to learn, inspire, and create. Any contributions you make are greatly appreciated. Please see our CONTRIBUTING.md file for more details on how to get started.

📄 License

Distributed under the Apache License 2.0. See LICENSE for more information.


📚 Documentation • 🐛 Report Bug • 💡 Request Feature

💖 Acknowledgements


Created by Stefanie Jane 🌠

If you find this project useful, buy me a Monster Ultra Violet!! ⚡️