diff --git a/src/components/Carousel.tsx b/src/components/Carousel.tsx
new file mode 100644
index 0000000..7c76fdc
--- /dev/null
+++ b/src/components/Carousel.tsx
@@ -0,0 +1,15 @@
+type carouselProps = {
+    text: string;
+    numItems?: number;
+
+}
+
+export default function Carousel({text,numItems}: carouselProps) {
+
+  return (
+    <div className= 'bg-blue-800'>
+        {text}
+        <p>There are {numItems} items.</p>
+    </div>
+  );
+}
diff --git a/src/stories/carousel.stories.ts b/src/stories/carousel.stories.ts
new file mode 100644
index 0000000..be1491b
--- /dev/null
+++ b/src/stories/carousel.stories.ts
@@ -0,0 +1,17 @@
+import type { Meta, StoryObj } from '@storybook/react-vite';
+
+import Carousel from '@/components/Carousel';
+
+const meta = {
+  component: Carousel,
+} satisfies Meta<typeof Carousel>;
+
+export default meta;
+type Story = StoryObj<typeof meta>;
+
+export const Primary: Story = {
+  args: {
+    text: "This is a carousel",
+    numItems: 3,
+  },
+};
\ No newline at end of file