diff --git a/src/stories/components/Cards/Cards.stories.js b/src/stories/components/Cards/Cards.stories.js
index b8ca8193b..7f9103a0e 100644
--- a/src/stories/components/Cards/Cards.stories.js
+++ b/src/stories/components/Cards/Cards.stories.js
@@ -15,43 +15,43 @@ export default {
 };
 
 export const Basic = {
-  render: () => Basic,
+  render: () => BasicTemplate,
   name: 'Basic',
   parameters: getDecoratedParameters(BasicTemplate),
 };
 
 export const WithActionButton = {
-  render: () => WithActionButton,
+  render: () => WithActionButtonTemplate,
   name: 'WithActionButton',
   parameters: getDecoratedParameters(WithActionButtonTemplate),
 };
 
 export const WithImage = {
-  render: () => WithImage,
+  render: () => WithImageTemplate,
   name: 'WithImage',
   parameters: getDecoratedParameters(WithImageTemplate),
 };
 
 export const WithThumbnail = {
-  render: () => WithThumbnail,
+  render: () => WithThumbnailTemplate,
   name: 'WithThumbnail',
   parameters: getDecoratedParameters(WithThumbnailTemplate),
 };
 
 export const Clickable = {
-  render: () => Clickable,
+  render: () => ClickableTemplate,
   name: 'Clickable',
   parameters: getDecoratedParameters(ClickableTemplate),
 };
 
 export const CardColumns = {
-  render: () => CardColumns,
+  render: () => CardColumnsTemplate,
   name: 'CardColumns',
   parameters: getDecoratedParameters(CardColumnsTemplate),
 };
 
 export const CardsWithTags = {
-  render: () => CardsWithTags,
+  render: () => CardsWithTagsTemplate,
   name: 'CardsWithTags',
   parameters: getDecoratedParameters(CardsWithTagsTemplate),
 };
diff --git a/src/stories/components/Tag/Tag.stories.js b/src/stories/components/Tag/Tag.stories.js
index 7271d2f4e..3af08fdb1 100644
--- a/src/stories/components/Tag/Tag.stories.js
+++ b/src/stories/components/Tag/Tag.stories.js
@@ -9,7 +9,7 @@ export default {
 };
 
 export const Default = {
-  render: () => Default,
+  render: () => DefaultTemplate,
   name: 'Default',
   height: '50px',
   parameters: getDecoratedParameters(DefaultTemplate),