diff --git a/packages/elements-react-stories/.storybook/global.css b/packages/elements-react-stories/.storybook/global.css
new file mode 100644
index 00000000..7601d0b7
--- /dev/null
+++ b/packages/elements-react-stories/.storybook/global.css
@@ -0,0 +1,3 @@
+html {
+  --font-sans: "Inter", "Helvetica Neue", "Helvetica", "Arial", sans-serif;
+}
diff --git a/packages/elements-react-stories/.storybook/preview.tsx b/packages/elements-react-stories/.storybook/preview.tsx
index ed3c18ce..77c5df5f 100644
--- a/packages/elements-react-stories/.storybook/preview.tsx
+++ b/packages/elements-react-stories/.storybook/preview.tsx
@@ -5,6 +5,7 @@ import type { Decorator, Preview } from "@storybook/react"
 import { chromaticModes } from "./modes"
 import "@ory/elements-react/theme/styles.css"
 import { merge } from "lodash"
+import "./global.css"
 
 const preview: Preview = {
   parameters: {