How to make titles for palette translatable?

[dragomano]

I want to have different palette titles for each language

  palette: 
    # Palette toggle for light mode
    - scheme: default
      toggle:
        icon: material/brightness-3 
        name: Switch to dark mode

    # Palette toggle for dark mode
    - scheme: slate
      toggle:
        icon: material/brightness-7
        name: Switch to light mode

[dragomano]

Solution:

overrides/partials/palette.html

<!-- Color palette toggle -->
<form class="md-header__option" data-md-component="palette">
  {% for option in config.theme.palette %}
    {% set scheme  = option.scheme  | d("default", true) %}
    {% set primary = option.primary | d("indigo", true) %}
    {% set accent  = option.accent  | d("indigo", true) %}
    <input
      class="md-option"
      data-md-color-media="{{ option.media }}"
      data-md-color-scheme="{{ scheme | replace(' ', '-') }}"
      data-md-color-primary="{{ primary | replace(' ', '-') }}"
      data-md-color-accent="{{ accent | replace(' ', '-') }}"
      {% if option.toggle %}
        aria-label="{{ option.toggle.name }}"
      {% else  %}
        aria-hidden="true"
      {% endif %}
      type="radio"
      name="__palette"
      id="__palette_{{ loop.index0 }}"
    />
    {% if option.toggle %}
      {% if "light" in option.media %}
        {% set paletteTitle = lang.t('toggle.dark') %}
      {% elif "dark" in option.media %}
        {% set paletteTitle = lang.t('toggle.auto') %}
      {% else %}
        {% set paletteTitle = lang.t('toggle.light') %}
      {% endif %}
      <label
        class="md-header__button md-icon"
        title="{{ paletteTitle }}"
        for="__palette_{{ loop.index % loop.length }}"
        hidden
      >
        {% include ".icons/" ~ option.toggle.icon ~ ".svg" %}
      </label>
    {% endif %}
  {% endfor %}
</form>

Add these lines to en.html:

  "toggle.light": "Switch to light mode",
  "toggle.dark": "Switch to dark mode",
  "toggle.auto": "Switch to system preference",

And translate them in your .html