diff --git a/.changes/add-inputcount-component.md b/.changes/add-inputcount-component.md
new file mode 100644
index 0000000..8c585e7
--- /dev/null
+++ b/.changes/add-inputcount-component.md
@@ -0,0 +1,8 @@
+---
+"@matechat/react": patch:feat
+---
+
+Add `InputCount` component.
+
+-Remove the input count div container and wrap it into a new component, allowing users to customize the input limit.
+-Remove the justify-center style from the div container and add ml-auto to the SenderButton to ensure button remains on the right side.
\ No newline at end of file
diff --git a/src/sender.tsx b/src/sender.tsx
index 7df19f1..0bd0653 100644
--- a/src/sender.tsx
+++ b/src/sender.tsx
@@ -20,7 +20,7 @@ export function InputCount({
   ...props
 }: InputCountProps) {
   return (
-    <span className={className} {...props}>
+    <span className={clsx("text-gray-400", className)} {...props}>
       {count} / {limit}
     </span>
   );