diff --git a/src/client/Main.ts b/src/client/Main.ts
index 4138224df..9e5c6dfc1 100644
--- a/src/client/Main.ts
+++ b/src/client/Main.ts
@@ -290,6 +290,9 @@ class Client {
       () => {
         console.log("Closing modals");
         document.getElementById("settings-button")?.classList.add("hidden");
+        document
+          .getElementById("username-validation-error")
+          ?.classList.add("hidden");
         [
           "single-player-modal",
           "host-lobby-modal",
diff --git a/src/client/UsernameInput.ts b/src/client/UsernameInput.ts
index c0cd900c9..3b3c24b7d 100644
--- a/src/client/UsernameInput.ts
+++ b/src/client/UsernameInput.ts
@@ -47,6 +47,7 @@ export class UsernameInput extends LitElement {
       />
       ${this.validationError
         ? html`<div
+            id="username-validation-error"
             class="absolute z-10 w-full mt-2 px-3 py-1 text-lg border rounded bg-white text-red-600 border-red-600 dark:bg-gray-700 dark:text-red-300 dark:border-red-300"
           >
             ${this.validationError}