diff --git a/apps/docs/components/marketing/hero/hero.tsx b/apps/docs/components/marketing/hero/hero.tsx
index a2f108eb25..5e773a2f17 100644
--- a/apps/docs/components/marketing/hero/hero.tsx
+++ b/apps/docs/components/marketing/hero/hero.tsx
@@ -20,18 +20,18 @@ export const Hero = () => {
     trackEvent("NavbarItem", {
       name,
       action: "press",
-      category: "home - gero",
+      category: "home - hero",
       data: url,
     });
   };
 
   return (
     <section className="flex relative overflow-hidden lg:overflow-visible w-full flex-nowrap justify-between items-center h-[calc(100vh_-_64px)] 2xl:h-[calc(84vh_-_64px)]">
-      <div className="flex relative z-20 flex-col gap-6 w-full lg:w-1/2 xl:mt-10">
-        <div className="w-full flex justify-center md:hidden">
+      <div className="relative z-20 flex flex-col w-full gap-6 lg:w-1/2 xl:mt-10">
+        <div className="flex justify-center w-full md:hidden">
           <Chip
             as={NextLink}
-            className="bg-default-100/50 hover:bg-default-100 border-default-200/80 dark:border-default-100/80 transition-colors cursor-pointer"
+            className="transition-colors cursor-pointer bg-default-100/50 hover:bg-default-100 border-default-200/80 dark:border-default-100/80"
             color="default"
             href="/blog/v2.3.0"
             variant="dot"
@@ -43,7 +43,7 @@ export const Hero = () => {
             </span>
           </Chip>
         </div>
-        <div className="text-center leading-8 md:leading-10 md:text-left">
+        <div className="leading-8 text-center md:leading-10 md:text-left">
           <div className="inline-block">
             <h1 className={title()}>Make&nbsp;</h1>
             <h1 className={title({color: "violet"})}>beautiful&nbsp;</h1>
@@ -53,7 +53,7 @@ export const Hero = () => {
         <h2 className={subtitle({fullWidth: true, class: "text-center md:text-left"})}>
           Beautiful, fast and modern React UI library.
         </h2>
-        <div className="flex flex-col md:flex-row items-center gap-4">
+        <div className="flex flex-col items-center gap-4 md:flex-row">
           <Button
             as={NextLink}
             className="w-full md:h-11 md:w-auto"
@@ -79,7 +79,7 @@ export const Hero = () => {
             Get Started
           </Button>
           <Snippet
-            className="w-full rounded-full hidden md:flex sm:w-auto"
+            className="hidden w-full rounded-full md:flex sm:w-auto"
             copyButtonProps={{
               radius: "full",
             }}