Control light or dark mode for iframe

Configuration Frontend
1

Hi,
I have a Grafana graph embedded in an iframe and I want to change the URL to present either light or dark mode based on whether the browser is in that mode.

What is the best way?

type: iframe
url: >-
  https://grafana.mine.life/d-solo/bekdb4mgddg5cb/forecasts?orgId=1&timezone=browser&refresh=5m&theme=light&panelId=1&__feature.dashboardSceneSolo
aspect_ratio: 50%
grid_options:
  columns: full
  rows: 7
card_mod:
  style: |
    ha-card { background: var(--card-background-color); }
2

If you have a browser mod, it includes a binary sensor for the device to detect dark mode. You can set the visibility condition of the card for a specific mod accordingly. If not, you have to create your own sensor.