diff --git a/src/components/input/Button.story.vue b/src/components/input/Button.story.vue
new file mode 100644
index 000000000..a26c7f476
--- /dev/null
+++ b/src/components/input/Button.story.vue
@@ -0,0 +1,26 @@
+<script lang="ts" setup>
+import {logEvent} from 'histoire/client'
+import XButton from './button.vue'
+</script>
+
+<template>
+	<Story :layout="{ type: 'grid', width: '200px' }">
+		<Variant title="primary">
+			<XButton @click="logEvent('Click', $event)" variant="primary">
+				Order pizza!
+			</XButton>
+		</Variant>
+
+		<Variant title="secondary">
+			<XButton @click="logEvent('Click', $event)" variant="secondary">
+				Order spaghetti!
+			</XButton>
+		</Variant>
+
+		<Variant title="tertiary">
+			<XButton @click="logEvent('Click', $event)" variant="tertiary">
+				Order tortellini!
+			</XButton>
+		</Variant>
+	</Story>
+</template>
\ No newline at end of file