diff --git a/apps/frontend/src/components/hero/hero.tsx b/apps/frontend/src/components/hero/hero.tsx
index 16b26f0..8e878d1 100644
--- a/apps/frontend/src/components/hero/hero.tsx
+++ b/apps/frontend/src/components/hero/hero.tsx
@@ -1,4 +1,4 @@
-import { createIdentifiableElement } from "@star4/react";
+import { ActionButton, ArrowForward, createIdentifiableElement, NorthEast } from "@star4/react";
 import { memo } from "react";
 
 import styles from "./hero.module.sass";
@@ -12,7 +12,13 @@ export namespace Hero {
 const HeroComponent = function Hero() {
   return (
     <div>
+      <div>
 
+      </div>
+      <ActionButton
+        onClick={() => {}}
+        icon={<NorthEast />}
+        label="Начать" />
     </div>
   );
 }
diff --git a/apps/frontend/src/components/hero/index.ts b/apps/frontend/src/components/hero/index.ts
index e69de29..5e2d3ca 100644
--- a/apps/frontend/src/components/hero/index.ts
+++ b/apps/frontend/src/components/hero/index.ts
@@ -0,0 +1 @@
+export * from "./hero";
diff --git a/apps/frontend/src/routes/index.lazy.tsx b/apps/frontend/src/routes/index.lazy.tsx
index 8f76eb2..fa2790a 100644
--- a/apps/frontend/src/routes/index.lazy.tsx
+++ b/apps/frontend/src/routes/index.lazy.tsx
@@ -1,14 +1,16 @@
 import { createLazyFileRoute } from "@tanstack/react-router";
 import { SectionHello } from "../components/section-hello";
+import { Hero } from "../components/hero";
+
+export const Route = createLazyFileRoute("/")({
+  component: Index,
+});
 
 function Index() {
   return (
     <div>
-      <SectionHello />
+      {/* <SectionHello /> */}
+      <Hero />
     </div>
   )
 }
-
-export const Route = createLazyFileRoute("/")({
-  component: Index,
-});