diff --git a/components/subheading.tsx b/components/subheading.tsx
new file mode 100644
index 0000000..13242c4
--- /dev/null
+++ b/components/subheading.tsx
@@ -0,0 +1,29 @@
+import { cn } from "@/lib/utils";
+import { MotionProps } from "framer-motion";
+import React from "react";
+import Balancer from "react-wrap-balancer";
+
+export const Subheading = ({
+  className,
+  as: Tag = "h2",
+  children,
+  ..._props
+}: {
+  className?: string;
+  as?: any;
+  children: any;
+  props?: React.HTMLAttributes<HTMLHeadingElement>;
+} & MotionProps &
+  React.HTMLAttributes<HTMLHeadingElement>) => {
+  return (
+    <Tag
+      className={cn(
+        "text-sm md:text-base  max-w-4xl text-left my-4 mx-auto",
+        "text-muted text-center font-normal",
+        className,
+      )}
+    >
+      <Balancer>{children}</Balancer>
+    </Tag>
+  );
+};