diff --git a/README.md b/README.md
index 0c5ca549..f0347ff1 100644
--- a/README.md
+++ b/README.md
@@ -91,6 +91,30 @@ const CustomGlobalStyle = () => ;
```
+## Using GlobalStyling with Storybook
+
+When rendering components inside Storybook, global styles must be applied at the preview level so that all stories inherit them consistently.
+
+You can achieve this by adding a decorator in your `.storybook/preview.js` (or `preview.tsx`) file.
+
+Example:
+
+```js
+import React from 'react';
+import { global } from '@storybook/design-system';
+
+const { GlobalStyle, loadFontsForStorybook } = global;
+
+loadFontsForStorybook();
+
+export const decorators = [
+ (Story) => (
+ <>
+
+
+ >
+ ),
+];
## Font Loading
Rather than `@import` fonts in the `GlobalStyle` component, the design system's font URL is exported with the intention of using it in a `` tag as the href. Different frameworks and environments handle component re-renders in their own way (a re-render would cause the font to be re-fetched), so this approach allows the design system consumers to choose the font loading method that is most appropriate for their environment.