diff --git a/web/pages/admin/config-federation.tsx b/web/pages/admin/config-federation.tsx
index b70cab647..68e71cbba 100644
--- a/web/pages/admin/config-federation.tsx
+++ b/web/pages/admin/config-federation.tsx
@@ -112,6 +112,17 @@ const ConfigFederation = () => {
     });
   };
 
+  const handleUsernameChange = ({ fieldName, value }: UpdateArgs) => {
+    handleFieldChange({
+      fieldName,
+      value,
+    });
+    setFormDataValues({
+      ...formDataValues,
+      username: value.replace(/\W/g, ''),
+    });
+  };
+
   const handleEnabledSwitchChange = (value: boolean) => {
     if (!value) {
       setFormDataValues({
@@ -304,7 +315,7 @@ const ConfigFederation = () => {
             {...TEXTFIELD_PROPS_FEDERATION_DEFAULT_USER}
             value={formDataValues.username}
             initialValue={username}
-            onChange={handleFieldChange}
+            onChange={handleUsernameChange}
             disabled={!enabled}
           />
           <TextFieldWithSubmit
diff --git a/web/stories/config-federation.stories.tsx b/web/stories/config-federation.stories.tsx
new file mode 100644
index 000000000..59bafbe8a
--- /dev/null
+++ b/web/stories/config-federation.stories.tsx
@@ -0,0 +1,16 @@
+import { Meta } from '@storybook/react';
+import ConfigFederation from '../pages/admin/config-federation';
+
+const meta = {
+  title: 'owncast/Admin/Config/Federation',
+  component: ConfigFederation,
+  parameters: {},
+} satisfies Meta<typeof ConfigFederation>;
+
+export default meta;
+
+const Template = arguments_ => <ConfigFederation {...arguments_} />;
+
+export const Default = Template.bind({});
+
+Default.args = {};
diff --git a/web/utils/config-constants.tsx b/web/utils/config-constants.tsx
index d9e89cf85..4d5f2e22f 100644
--- a/web/utils/config-constants.tsx
+++ b/web/utils/config-constants.tsx
@@ -65,8 +65,7 @@ export async function postConfigUpdateToAPI(args: ApiPostArgs) {
     } else if (onError) {
       onError(result.message);
     }
-  }
-  catch (e) {
+  } catch (e) {
     if (onError) {
       onError(e.message);
     }
@@ -331,7 +330,7 @@ export const TEXTFIELD_PROPS_FEDERATION_DEFAULT_USER = {
   placeholder: 'owncast',
   default: 'owncast',
   label: 'Username',
-  tip: 'The username used for sending and receiving activities from the Fediverse. For example, if you use "bob" as a username you would send messages to the fediverse from @bob@yourserver. Once people start following your instance you should not change this.',
+  tip: 'The username used for sending and receiving activities from the Fediverse. For example, if you use "bob" as a username you would send messages to the fediverse from @bob@yourserver. Once people start following your instance you should not change this.\nNote: Username cannot have special characters. ',
 };
 
 export const TEXTFIELD_PROPS_FEDERATION_INSTANCE_URL = {