diff --git a/src/shared/Heading2.tsx b/src/shared/Heading2.tsx
new file mode 100644
index 0000000..bff953b
--- /dev/null
+++ b/src/shared/Heading2.tsx
@@ -0,0 +1,32 @@
+import React from "react";
+import { ReactNode } from "react";
+
+export interface Heading2Props {
+  heading?: ReactNode;
+  subHeading?: ReactNode;
+  className?: string;
+}
+
+const Heading2: React.FC<Heading2Props> = ({
+  className = "",
+  heading = "Stays in Tokyo",
+  subHeading,
+}) => {
+  return (
+    <div className={`mb-12 lg:mb-16 ${className}`}>
+      <h2 className="text-4xl font-semibold">{heading}</h2>
+      {subHeading ? (
+        subHeading
+      ) : (
+        <span className="block text-neutral-500 dark:text-neutral-400 mt-3">
+          233 stays
+          <span className="mx-2">·</span>
+          Aug 12 - 18
+          <span className="mx-2">·</span>2 Guests
+        </span>
+      )}
+    </div>
+  );
+};
+
+export default Heading2;