Dynamic Icons

Dynamically update your button appearance with custom icons!

Dynamic Icon Example

This example will work with most button types, but we will be using an Action Button

Setup

  • In the Stream Deck software:
  1. Assign a Streamer.bot Action button to your desired location
  2. Select your Streamer.bot instance (optional)
  3. Click the copy icon next to Button ID, we will need it in the next steps
  • In Streamer.bot:
  1. Create a new Action, we will call ours Update Stream Deck Background
  2. Add a new Sub-Action, Stream Deck -> Set Background
  3. Paste the Button ID copied from Stream Deck into the Button ID field.
  4. Set Image to your desired icon, we will use https://api.iconify.design/mdi:alert-box.svg?color=%23ffbb00
  5. (Optional) Enter a Color to modify the background color, we will use #333333
  • Return to the Stream Deck software:
    1. Select your Streamer.bot instance and the newly created action to test it out directly from your Stream Deck!
  • When your action is executed, it will make the modifications to the Stream Deck button!

  • Tips & Tricks

    • Highly Recommended to use Icones.js to easily obtain icons (with color!) in the supported formats (URL, Data URL, or SVG)
Table of Contents