diff --git a/components/Admin/settings.js b/components/Admin/settings.js
index 32add1a..10c0ca3 100644
--- a/components/Admin/settings.js
+++ b/components/Admin/settings.js
@@ -3,146 +3,151 @@ import "i18n/i18n";
 import "tailwindcss/tailwind.css";
 
 function debounce(callback, wait = 400) {
-  let timeout;
-  return (...args) => {
-    clearTimeout(timeout);
-    timeout = setTimeout(function () {
-      callback.apply(this, args);
-    }, wait);
-  };
+    let timeout;
+    return (...args) => {
+        clearTimeout(timeout);
+        timeout = setTimeout(function () {
+            callback.apply(this, args);
+        }, wait);
+    };
 }
 
 export function ThemeSwitcher(props) {
-  const availableThemes = {
-    default: {
-      bgcolor: "white",
-      fgcolor: "text-black",
-      title: "default",
-    },
-    darkTheme: {
-      bgcolor: "#18181B",
-      fgcolor: "text-white",
-      title: "dark theme",
-    },
-    slate: {
-      bgcolor: "#18181B",
-      fgcolor: "text-white",
-      title: "slate",
-    },
-    educational: {
-      bgcolor: "#fffbf0",
-      fgcolor: "text-black",
-      title: "educational",
-    },
-  };
-  return (
-    <div class="flex flex-row space-x-5 items-center">
-      <svg
-        xmlns="http://www.w3.org/2000/svg"
-        aria-hidden="true"
-        role="img"
-        width="32"
-        height="32"
-        viewBox="0 0 16 16"
-      >
-        <path
-          d="M8 1.002v2.5a.5.5 0 0 0 1 0v-2.5h1v3.494a.5.5 0 0 0 1 0V1.002h1.5V7h-9V1.002H8ZM3.5 8v.5a2 2 0 0 0 2 2h1v2.999a1.5 1.5 0 0 0 3 0v-3h1a2 2 0 0 0 2-2V8h-9Z"
-          fill="gray"
-        />
-      </svg>
-      <select
-        class="bg-secondary-300 text-foreground rounded-lg p-2"
-        value={props.game.settings.theme}
-        onChange={(e) => {
-          props.game.settings.theme = e.target.value;
-          props.setGame((prv) => ({ ...prv }));
-          props.send({ action: "data", data: props.game });
-        }}
-      >
-        {Object.keys(availableThemes).map((key, index) => (
-          <option
-            value={key}
-            key={index}
-            style={{
-              backgroundColor: availableThemes[key].bgcolor
-            }}
-            class={`${availableThemes[key].fgcolor}`}
-          >
-            {availableThemes[key].title}
-          </option>
-        ))}
-      </select>
-    </div>
-  );
+    const availableThemes = {
+        default: {
+            bgcolor: "white",
+            fgcolor: "text-black",
+            title: "default",
+        },
+        darkTheme: {
+            bgcolor: "#18181B",
+            fgcolor: "text-white",
+            title: "dark theme",
+        },
+        slate: {
+            bgcolor: "#18181B",
+            fgcolor: "text-white",
+            title: "slate",
+        },
+        educational: {
+            bgcolor: "#fffbf0",
+            fgcolor: "text-black",
+            title: "educational",
+        },
+        red: {
+            bgcolor: "#7B2C35",
+            fgcolor: "text-white",
+            title: "red",
+        },
+    };
+    return (
+        <div class="flex flex-row space-x-5 items-center">
+            <svg
+                xmlns="http://www.w3.org/2000/svg"
+                aria-hidden="true"
+                role="img"
+                width="32"
+                height="32"
+                viewBox="0 0 16 16"
+            >
+                <path
+                    d="M8 1.002v2.5a.5.5 0 0 0 1 0v-2.5h1v3.494a.5.5 0 0 0 1 0V1.002h1.5V7h-9V1.002H8ZM3.5 8v.5a2 2 0 0 0 2 2h1v2.999a1.5 1.5 0 0 0 3 0v-3h1a2 2 0 0 0 2-2V8h-9Z"
+                    fill="gray"
+                />
+            </svg>
+            <select
+                class="bg-secondary-300 text-foreground rounded-lg p-2"
+                value={props.game.settings.theme}
+                onChange={(e) => {
+                    props.game.settings.theme = e.target.value;
+                    props.setGame((prv) => ({ ...prv }));
+                    props.send({ action: "data", data: props.game });
+                }}
+            >
+                {Object.keys(availableThemes).map((key, index) => (
+                    <option
+                        value={key}
+                        key={index}
+                        style={{
+                            backgroundColor: availableThemes[key].bgcolor
+                        }}
+                        class={`${availableThemes[key].fgcolor}`}
+                    >
+                        {availableThemes[key].title}
+                    </option>
+                ))}
+            </select>
+        </div>
+    );
 }
 
 function FinalRoundTitleChanger(props) {
-  const { i18n, t } = useTranslation();
-  return (
-    <div class="flex flex-row space-x-5 items-center">
-      <p class="text-xl text-foreground">{t("Final Round Title")}:</p>
-      <input
-        class="border-4 rounded text-xl w-32 bg-secondary-500 text-foreground p-1 placeholder-secondary-900"
-        onChange={debounce((e) => {
-          props.game.settings.final_round_title = e.target.value;
-          props.setGame((prv) => ({ ...prv }));
-          props.send({ action: "data", data: props.game });
-        })}
-        defaultValue={props.game.settings.final_round_title}
-        placeholder={t("fast money")}
-      ></input>
-    </div>
-  );
+    const { i18n, t } = useTranslation();
+    return (
+        <div class="flex flex-row space-x-5 items-center">
+            <p class="text-xl text-foreground">{t("Final Round Title")}:</p>
+            <input
+                class="border-4 rounded text-xl w-32 bg-secondary-500 text-foreground p-1 placeholder-secondary-900"
+                onChange={debounce((e) => {
+                    props.game.settings.final_round_title = e.target.value;
+                    props.setGame((prv) => ({ ...prv }));
+                    props.send({ action: "data", data: props.game });
+                })}
+                defaultValue={props.game.settings.final_round_title}
+                placeholder={t("fast money")}
+            ></input>
+        </div>
+    );
 }
 
 export default function AdminSettings(props) {
-  let game = props.game;
-  const { i18n, t } = useTranslation();
+    let game = props.game;
+    const { i18n, t } = useTranslation();
+
+    function HideGameQuestions(props) {
+        return (
+            <div class="flex flex-col">
+                <div class="flex flex-row space-x-5 items-center">
+                    <div>
+                        <p class="text-xl normal-case text-foreground">
+                            {t("Hide questions")}:
+                        </p>
+                    </div>
+                    <input
+                        class="w-4 h-4 rounded  placeholder-secondary-900"
+                        checked={game.settings.hide_questions}
+                        onChange={(e) => {
+                            game.settings.hide_questions = e.target.checked;
+                            props.setGame((prv) => ({ ...prv }));
+                            props.send({ action: "data", data: game });
+                        }}
+                        type="checkbox"
+                    ></input>
+                </div>
+                <div>
+                    <p class="text-sm normal-case text-secondary-900 italic max-w-xs">
+                        {t("hide questions on the game window and player buzzer screens")}
+                    </p>
+                </div>
+            </div>
+        );
+    }
 
-  function HideGameQuestions(props) {
     return (
-      <div class="flex flex-col">
-        <div class="flex flex-row space-x-5 items-center">
-          <div>
-            <p class="text-xl normal-case text-foreground">
-              {t("Hide questions")}:
-            </p>
-          </div>
-          <input
-            class="w-4 h-4 rounded  placeholder-secondary-900"
-            checked={game.settings.hide_questions}
-            onChange={(e) => {
-              game.settings.hide_questions = e.target.checked;
-              props.setGame((prv) => ({ ...prv }));
-              props.send({ action: "data", data: game });
-            }}
-            type="checkbox"
-          ></input>
-        </div>
-        <div>
-          <p class="text-sm normal-case text-secondary-900 italic max-w-xs">
-            {t("hide questions on the game window and player buzzer screens")}
-          </p>
-        </div>
-      </div>
+        <>
+            <div class="grid grid-cols-2 gap-y-10 gap-x-48">
+                <HideGameQuestions
+                    game={game}
+                    setGame={props.setGame}
+                    send={props.send}
+                />
+                <ThemeSwitcher game={game} setGame={props.setGame} send={props.send} />
+                <FinalRoundTitleChanger
+                    game={game}
+                    setGame={props.setGame}
+                    send={props.send}
+                />
+            </div>
+        </>
     );
-  }
-
-  return (
-    <>
-        <div class="grid grid-cols-2 gap-y-10 gap-x-48">
-        <HideGameQuestions
-          game={game}
-          setGame={props.setGame}
-          send={props.send}
-        />
-        <ThemeSwitcher game={game} setGame={props.setGame} send={props.send} />
-        <FinalRoundTitleChanger
-          game={game}
-          setGame={props.setGame}
-          send={props.send}
-        />
-        </div>
-    </>
-  );
 }
diff --git a/i18n/i18n.js b/i18n/i18n.js
index be3c5b5..84416d2 100644
--- a/i18n/i18n.js
+++ b/i18n/i18n.js
@@ -6,32 +6,36 @@ import translationEN from "public/locales/en/translation.json";
 import translationES from "public/locales/es/translation.json";
 import translationID from "public/locales/id/translation.json";
 import translationET from "public/locales/et/translation.json";
+import translationFR from "public/locales/fr/translation.json";
 
 const resources = {
-  en: {
-    translation: translationEN,
-  },
-  es: {
-    translation: translationES,
-  },
-  id: {
-    translation: translationID,
-  },
-  et: {
-    translation: translationET,
-  },
-};
-i18n
-  .use(LanguageDetector)
-  .use(initReactI18next)
-  .init({
-    resources,
-    react: {
-      useSuspense: false,
+    en: {
+        translation: translationEN,
+    },
+    es: {
+        translation: translationES,
+    },
+    id: {
+        translation: translationID,
     },
-    fallbackLng: "en",
-    interpolation: {
-      format,
+    et: {
+        translation: translationET,
     },
-    whitelist: ["es", "en", "id", "et"],
-  });
+    fr: {
+        translation: translationFR,
+    },
+};
+i18n
+    .use(LanguageDetector)
+    .use(initReactI18next)
+    .init({
+        resources,
+        react: {
+            useSuspense: false,
+        },
+        fallbackLng: "en",
+        interpolation: {
+            format,
+        },
+        whitelist: ["es", "en", "id", "et", "fr"],
+    });
diff --git a/i18n/i18next-scanner.config.js b/i18n/i18next-scanner.config.js
index e4d29dc..b1e96c0 100644
--- a/i18n/i18next-scanner.config.js
+++ b/i18n/i18next-scanner.config.js
@@ -14,7 +14,7 @@ module.exports = {
     },
     trans: false,
     plural: false,
-    lngs: ["en", "es", "et", "id"],
+    lngs: ["en", "es", "et", "id","fr"],
     ns: ["translation"],
     defaultNs: "translation",
     defaultValue: "__STRING_NOT_TRANSLATED__",