diff --git a/components/opacitycheckerboard/stories/opacitycheckerboard.stories.js b/components/opacitycheckerboard/stories/opacitycheckerboard.stories.js
index e0e4a8828d7..08b6043e779 100644
--- a/components/opacitycheckerboard/stories/opacitycheckerboard.stories.js
+++ b/components/opacitycheckerboard/stories/opacitycheckerboard.stories.js
@@ -5,7 +5,7 @@ import { styleMap } from "lit/directives/style-map.js";
 import { Template } from "./template";
 
 export default {
-	title: "Components/Opacity checkerboard",
+	title: "Utilities/Opacity checkerboard",
 	description:
 		"Opacity checkerboard is used with other components to highlight opacity.",
 	component: "OpacityCheckerboard",
diff --git a/components/opacitycheckerboard/stories/template.js b/components/opacitycheckerboard/stories/template.js
index 79893482d11..6daa8d63f47 100644
--- a/components/opacitycheckerboard/stories/template.js
+++ b/components/opacitycheckerboard/stories/template.js
@@ -22,6 +22,8 @@ export const Template = ({
 			})}
 			style=${ifDefined(styleMap({
 				"--mod-opacity-checkerboard-position": backgroundPosition,
+				"inline-size": "100%",
+				"block-size": "100%",
 				...customStyles,
 			}))}
 			role=${ifDefined(role)}