diff --git a/apps/web/components/getting-started/components/Steps.tsx b/apps/web/components/getting-started/components/Steps.tsx
index fa1691b123..6c99c800a3 100644
--- a/apps/web/components/getting-started/components/Steps.tsx
+++ b/apps/web/components/getting-started/components/Steps.tsx
@@ -22,12 +22,12 @@ const Steps = (props: ISteps) => {
               key={`step-${index}`}
               onClick={() => navigateToStep(index)}
               className={classNames(
-                "h-1 w-1/4 rounded-[1px] bg-black dark:bg-white",
+                "h-1 w-full rounded-[1px] bg-black dark:bg-white",
                 index < currentStep ? "cursor-pointer" : ""
               )}
             />
           ) : (
-            <div key={`step-${index}`} className="h-1 w-1/4 rounded-[1px] bg-black bg-opacity-25" />
+            <div key={`step-${index}`} className="h-1 w-full rounded-[1px] bg-black bg-opacity-25" />
           );
         })}
       </div>
diff --git a/packages/features/ee/teams/components/v2/CreateNewTeam.tsx b/packages/features/ee/teams/components/v2/CreateNewTeam.tsx
index d62350b01f..b48bc128ea 100644
--- a/packages/features/ee/teams/components/v2/CreateNewTeam.tsx
+++ b/packages/features/ee/teams/components/v2/CreateNewTeam.tsx
@@ -2,6 +2,7 @@ import { useForm, Controller } from "react-hook-form";
 
 import { WEBAPP_URL } from "@calcom/lib/constants";
 import { useLocale } from "@calcom/lib/hooks/useLocale";
+import slugify from "@calcom/lib/slugify";
 import { trpc } from "@calcom/trpc/react";
 import { Icon } from "@calcom/ui";
 import { Button, Avatar } from "@calcom/ui/v2";
@@ -45,7 +46,11 @@ const CreateANewTeamForm = (props: { nextStep: () => void; setTeamId: (teamId: n
               value={value}
               onChange={(e) => {
                 formMethods.setValue("name", e?.target.value);
+                if (formMethods.formState.touchedFields["slug"] === undefined) {
+                  formMethods.setValue("slug", slugify(e?.target.value));
+                }
               }}
+              autoComplete="off"
             />
           )}
         />
@@ -63,7 +68,7 @@ const CreateANewTeamForm = (props: { nextStep: () => void; setTeamId: (teamId: n
               addOnLeading={`${WEBAPP_URL}/team/`}
               value={value}
               onChange={(e) => {
-                formMethods.setValue("slug", e?.target.value);
+                formMethods.setValue("slug", slugify(e?.target.value), { shouldTouch: true });
               }}
             />
           )}
diff --git a/packages/ui/v2/modules/event-types/CreateEventType.tsx b/packages/ui/v2/modules/event-types/CreateEventType.tsx
index 4696b2fd84..ca7682c15c 100644
--- a/packages/ui/v2/modules/event-types/CreateEventType.tsx
+++ b/packages/ui/v2/modules/event-types/CreateEventType.tsx
@@ -84,16 +84,6 @@ export default function CreateEventTypeButton(props: CreateEventTypeBtnProps) {
     // If query params change, update the form
   }, [router.isReady, router.query, setValue]);
 
-  useEffect(() => {
-    const subscription = watch((value, { name, type }) => {
-      if (name === "title" && type === "change") {
-        if (value.title) setValue("slug", slugify(value.title));
-        else setValue("slug", "");
-      }
-    });
-    return () => subscription.unsubscribe();
-  }, [watch, setValue]);
-
   const createMutation = trpc.useMutation("viewer.eventTypes.create", {
     onSuccess: async ({ eventType }) => {
       await router.replace("/event-types/" + eventType.id);
@@ -202,7 +192,17 @@ export default function CreateEventTypeButton(props: CreateEventTypeBtnProps) {
                 value={teamId}
               />
             )}
-            <TextField label={t("title")} placeholder={t("quick_chat")} {...register("title")} />
+            <TextField
+              label={t("title")}
+              placeholder={t("quick_chat")}
+              {...register("title")}
+              onChange={(e) => {
+                form.setValue("title", e?.target.value);
+                if (form.formState.touchedFields["slug"] === undefined) {
+                  form.setValue("slug", slugify(e?.target.value));
+                }
+              }}
+            />
 
             {process.env.NEXT_PUBLIC_WEBSITE_URL !== undefined &&
             process.env.NEXT_PUBLIC_WEBSITE_URL?.length >= 21 ? (
@@ -211,6 +211,9 @@ export default function CreateEventTypeButton(props: CreateEventTypeBtnProps) {
                 required
                 addOnLeading={<>/{pageSlug}/</>}
                 {...register("slug")}
+                onChange={(e) => {
+                  form.setValue("slug", slugify(e?.target.value), { shouldTouch: true });
+                }}
               />
             ) : (
               <TextField