> For the complete documentation index, see [llms.txt](https://codedthemes.gitbook.io/materially-react-material-documentation/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://codedthemes.gitbook.io/materially-react-material-documentation/template-config.md).

# Template Config

{% hint style="info" %}
You can edit this file at **`[src/config]`**
{% endhint %}

<table><thead><tr><th>Option</th><th width="174">Default</th><th>Data Type</th><th>Description</th></tr></thead><tbody><tr><td>mode</td><td>light</td><td>string</td><td><code>light</code>, <code>dark</code></td></tr><tr><td>i18n</td><td>en</td><td>string</td><td><p><code>en</code> - English</p><p><code>fr</code> - français</p><p><code>ro</code> - Română</p><p><code>zh</code> - 中国人</p></td></tr><tr><td>themeDirection</td><td>ltr</td><td>string</td><td><code>ltr</code>, <code>rtl</code></td></tr></tbody></table>

{% tabs %}
{% tab title="Typescript" %}
{% code title="src/config.ts " %}

```typescript
// ==============================|| THEME ENUM ||============================== //

export enum ThemeMode {
  LIGHT = 'light',
  DARK = 'dark'
}

export enum ThemeDirection {
  LTR = 'ltr',
  RTL = 'rtl'
}

export enum ThemeI18n {
  EN = 'en',
  FR = 'fr',
  RO = 'ro',
  ZH = 'zh'
}

// ==============================|| THEME CONFIG ||============================== //

const config: ConfigProps = {
  mode: ThemeMode.LIGHT,
  i18n: ThemeI18n.EN,
  themeDirection: ThemeDirection.LTR
};

export default config;

```

{% endcode %}
{% endtab %}

{% tab title="Javascript" %}
{% code title="src/config.js" %}

```javascript
// ==============================|| THEME ENUM ||============================== //

export let ThemeMode;

(function (ThemeMode) {
  ThemeMode['LIGHT'] = 'light';
  ThemeMode['DARK'] = 'dark';
})(ThemeMode || (ThemeMode = {}));

export let ThemeDirection;

(function (ThemeDirection) {
  ThemeDirection['LTR'] = 'ltr';
  ThemeDirection['RTL'] = 'rtl';
})(ThemeDirection || (ThemeDirection = {}));

export let ThemeI18n;

(function (ThemeI18n) {
  ThemeI18n['EN'] = 'en';
  ThemeI18n['FR'] = 'fr';
  ThemeI18n['RO'] = 'ro';
  ThemeI18n['ZH'] = 'zh';
})(ThemeI18n || (ThemeI18n = {}));

// ==============================|| THEME CONFIG ||============================== //

const config = {
  mode: ThemeMode.LIGHT,
  i18n: ThemeI18n.EN,
  themeDirection: ThemeDirection.LTR
};

export default config;

```

{% endcode %}
{% endtab %}
{% endtabs %}

{% tabs %}
{% tab title=".env" %}

```

VITE_APP_VERSION = Version of app
...
...
```

{% endtab %}
{% endtabs %}