diff --git a/src/stories/Checkbox.stories.tsx b/src/stories/Checkbox.stories.tsx
new file mode 100644
index 0000000..7faf1bd
--- /dev/null
+++ b/src/stories/Checkbox.stories.tsx
@@ -0,0 +1,58 @@
+import Checkbox from "../components/Checkbox";
+import { Meta, Story, ComponentStory, ComponentMeta } from "@storybook/react";
+import React, { useState } from "react";
+import { ReactComponent as Checkmark } from "assets/svg/check.svg";
+import { boolean } from "yup/lib/locale";
+
+export default {
+  title: "Checkbox",
+  component: Checkbox,
+  // More on argTypes: https://storybook.js.org/docs/react/api/argtypes
+  argTypes: {
+    isChecked: {
+      type: "boolean",
+    },
+    children: {
+      type: "string",
+      defaultValue: "Use light theme",
+    },
+    disabled: {
+      type: "boolean",
+      defaultValue: "false",
+    },
+    id: {
+      type: "string",
+      defaultValue: "uniqueID",
+    },
+    name: {
+      type: "string",
+      defaultValue: "checkbox name",
+    },
+  },
+} as ComponentMeta<typeof Checkbox>;
+
+const Template: ComponentStory<typeof Checkbox> = (args) => (
+  <Checkbox {...args} />
+);
+
+export const Checked = Template.bind({});
+Checked.args = {
+  isChecked: true,
+  children: "This is custom checkbox",
+};
+
+export const Unchecked = Template.bind({});
+Unchecked.args = {
+  isChecked: false,
+};
+
+export const Disabled = Template.bind({});
+Disabled.args = {
+  disabled: true,
+};
+
+export const Hovered = bindTemplate({});
+Hovered.args = {
+  className: "hover:true",
+  isChecked: false,
+};