Как мне получить значения из обычного текстового файла в html?

Question

Я пытаюсь создать электронное приложение, в котором пользователь может переключать используемую тему, которая хранится в файле. css в папке themes.

Вот пример файла темы:

@import url("https://fonts.googleapis.com/css2?family=Inconsolata&family=Open+Sans&family=Ubuntu:wght@300&display=swap");

:root{ /*NOTE: Make all theme changes here.*/
  --background-color: #460101;
  --base-color: #9f9202;
  --foreground-color: white;
  --accent-color: #1B6ACB;

  --background-image: ;
  --base-background-image: url("https://www.transparenttextures.com/patterns/45-degree-fabric-dark.png");
  --box-shadow: 0px 0px 4px 2px #332f2f88;

  --border-radius: 5px;
  --border-width: 1px;
  --border-color: #282828;
  --hover-color: #DCCA0488; /*Base color, but slightly lighter*/
  --focus-border-color: #3E3E3E; /*Border color, but a little lighter*/
  --active-color: #5B190BCC; /*Background color, but darker*/

  --font-family-header: 'Ubuntu', sans-serif;
  --font-family-body: 'Open Sans', sans-serif;
  --font-family-code: 'Inconsolata', monospace;
}

Эти css переменные затем интерпретируются другим css файлом (index.css), связанным в index.html:

<link rel="stylesheet" href="./themes/theme-name.css">
<link rel="stylesheet" href="./index.css">

Я хочу мои пользователи, чтобы иметь возможность изменять значение theme-name во внешнем текстовом файле. В моем файле html, как мне получить значение theme-name из этого внешнего текстового файла?

Спасибо!