# Vega font change based on kibana theme

**URL:** https://discuss.elastic.co/t/vega-font-change-based-on-kibana-theme/374783
**Category:** Kibana
**Tags:** vega
**Created:** [February 19, 2025, 7:17pm UTC](https://discuss.elastic.co/t/vega-font-change-based-on-kibana-theme/374783 "2025-02-19T19:17:45Z")
**Posts on this page:** 3
**Page:** 1

<div class="post-metadata">

### Author: ![Ryan\_Clark](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/ryan_clark/32/44467_2.png) [@Ryan\_Clark](https://discuss.elastic.co/u/Ryan_Clark)
#### Post date: [February 19, 2025, 7:17pm UTC](https://discuss.elastic.co/t/vega-font-change-based-on-kibana-theme/374783/1 "2025-02-19T19:17:45Z")

</div>

Is there a way to have the font in vega auto adjust when the theme is changed in Kibana (light/dark modes)? I've tried the code below but it's not working. Basically, looking for white font when in dark mode and black font when in light mode.

```auto
{
  "$schema": "https://vega.github.io/schema/vega/v5.json",
  "signals": [
    {
      "name": "isLightMode",
      "value": false,
      "update": "'#FFFFFF' === '#FFFFFF'"
    },
    {
      "name": "textColor",
      "update": "isLightMode ? 'black' : 'white'"
    }
  ],
  "marks": [
    {
      "type": "text",
      "encode": {
        "enter": {
          "fill": {"signal": "textColor"},
          "fontWeight": {"value": "Bold"},
          "fontSize": {"value": 15},
          "text": {"value": "Event List"},
          "x": {"value": 10},
          "y": {"value": 20}
        }
      }
    }
  ]
}

```

---

<div class="post-metadata">

### Author: ![carly.richmond](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/carly.richmond/32/104935_2.png) [@carly.richmond](https://discuss.elastic.co/u/carly.richmond)
#### Post date: [February 20, 2025, 9:54am UTC](https://discuss.elastic.co/t/vega-font-change-based-on-kibana-theme/374783/2 "2025-02-20T09:54:20Z")

</div>

Hi @Ryan_Clark,

Welcome back! Sadly there is not currently a way to detect the Kibana theme used in Vega. But there is an [open issue in GitHub](https://github.com/elastic/kibana/issues/178254) for this feature if you want to watch it for updates.

Hope that helps!

---

<div class="post-metadata">

### Author: ![Ryan\_Clark](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/ryan_clark/32/44467_2.png) [@Ryan\_Clark](https://discuss.elastic.co/u/Ryan_Clark)
#### Post date: [February 20, 2025, 8:34pm UTC](https://discuss.elastic.co/t/vega-font-change-based-on-kibana-theme/374783/3 "2025-02-20T20:34:55Z")

</div>

Thanks for the confirmation. I ended up finding a font color that looks "OK" in both themes. I think it would be a good feature to have, I'm glad there is an open issue for it already.
