diff --git a/packages/react-core/src/components/Card/examples/Card.md b/packages/react-core/src/components/Card/examples/Card.md
index a0ab8d8dd69..671249655bf 100644
--- a/packages/react-core/src/components/Card/examples/Card.md
+++ b/packages/react-core/src/components/Card/examples/Card.md
@@ -131,7 +131,7 @@ You must avoid rendering any other interactive content within the `<Card>` when
 
 ### Single selectable
 
-When a group of single selectable cards are related, you must pass the same `name` property to each card's `selectableActions` property.
+When a group of single selectable cards are related, you must pass the same `name` property to each card's `selectableActions` property. For more guidance on selectable cards with hidden input, see our [cards as tiles examples](#cards-as-tiles).
 
 ```ts file='./CardSingleSelectable.tsx'
 
diff --git a/packages/react-core/src/components/Card/examples/CardSelectable.tsx b/packages/react-core/src/components/Card/examples/CardSelectable.tsx
index 2d32bcdedaf..28ba8317c41 100644
--- a/packages/react-core/src/components/Card/examples/CardSelectable.tsx
+++ b/packages/react-core/src/components/Card/examples/CardSelectable.tsx
@@ -5,7 +5,8 @@ export const SelectableCard: React.FunctionComponent = () => {
   const [isChecked1, setIsChecked1] = useState(false);
   const [isChecked2, setIsChecked2] = useState(false);
   const [isChecked3, setIsChecked3] = useState(false);
-  const [isSecondary, setIsSecondary] = useState<boolean>(false);
+  const [isSecondary, setIsSecondary] = useState(false);
+  const [displayCheckbox, setDisplayCheckbox] = useState(false);
 
   const id1 = 'selectable-card-input-1';
   const id2 = 'selectable-card-input-2';
@@ -31,6 +32,10 @@ export const SelectableCard: React.FunctionComponent = () => {
     setIsSecondary(checked);
   };
 
+  const toggleHide = (checked: boolean) => {
+    setDisplayCheckbox(checked);
+  };
+
   return (
     <>
       <Checkbox
@@ -40,68 +45,76 @@ export const SelectableCard: React.FunctionComponent = () => {
         id="toggle-variant-selectable"
         name="toggle-variant"
       />
-      <div style={{ marginTop: '15px' }}>
-        <Gallery hasGutter>
-          <Card
-            id="selectable-card-example-1"
-            isSelectable
-            isSelected={isChecked1}
-            variant={isSecondary ? 'secondary' : 'default'}
+      <Checkbox
+        label="Hide checkbox"
+        isChecked={displayCheckbox}
+        onChange={(_event, checked) => toggleHide(checked)}
+        id="selectable-toggle-hide-checkbox"
+        name="toggle-hide"
+      />
+      <Gallery hasGutter style={{ marginTop: '15px' }}>
+        <Card
+          id="selectable-card-example-1"
+          isSelectable
+          isSelected={isChecked1}
+          variant={isSecondary ? 'secondary' : 'default'}
+        >
+          <CardHeader
+            selectableActions={{
+              selectableActionId: id1,
+              selectableActionAriaLabelledby: 'selectable-card-example-1',
+              name: id1,
+              onChange,
+              hasNoOffset: true,
+              isHidden: displayCheckbox
+            }}
           >
-            <CardHeader
-              selectableActions={{
-                selectableActionId: id1,
-                selectableActionAriaLabelledby: 'selectable-card-example-1',
-                name: id1,
-                onChange,
-                hasNoOffset: true
-              }}
-            >
-              <CardTitle>First card</CardTitle>
-            </CardHeader>
-            <CardBody>This card is selectable.</CardBody>
-          </Card>
-          <Card
-            id="selectable-card-example-2"
-            isSelectable
-            isSelected={isChecked2}
-            variant={isSecondary ? 'secondary' : 'default'}
+            <CardTitle>First card</CardTitle>
+          </CardHeader>
+          <CardBody>This card is selectable.</CardBody>
+        </Card>
+        <Card
+          id="selectable-card-example-2"
+          isSelectable
+          isSelected={isChecked2}
+          variant={isSecondary ? 'secondary' : 'default'}
+        >
+          <CardHeader
+            selectableActions={{
+              selectableActionId: id2,
+              selectableActionAriaLabelledby: 'selectable-card-example-2',
+              name: id2,
+              onChange,
+              hasNoOffset: true,
+              isHidden: displayCheckbox
+            }}
           >
-            <CardHeader
-              selectableActions={{
-                selectableActionId: id2,
-                selectableActionAriaLabelledby: 'selectable-card-example-2',
-                name: id2,
-                onChange,
-                hasNoOffset: true
-              }}
-            >
-              <CardTitle>Second card</CardTitle>
-            </CardHeader>
-            <CardBody>This card is selectable.</CardBody>
-          </Card>
-          <Card
-            id="selectable-card-example-3"
-            isSelectable
-            isDisabled
-            isSelected={isChecked3}
-            variant={isSecondary ? 'secondary' : 'default'}
+            <CardTitle>Second card</CardTitle>
+          </CardHeader>
+          <CardBody>This card is selectable.</CardBody>
+        </Card>
+        <Card
+          id="selectable-card-example-3"
+          isSelectable
+          isDisabled
+          isSelected={isChecked3}
+          variant={isSecondary ? 'secondary' : 'default'}
+        >
+          <CardHeader
+            selectableActions={{
+              selectableActionId: id3,
+              selectableActionAriaLabelledby: 'selectable-card-example-3',
+              name: id3,
+              onChange,
+              hasNoOffset: true,
+              isHidden: displayCheckbox
+            }}
           >
-            <CardHeader
-              selectableActions={{
-                selectableActionId: id3,
-                selectableActionAriaLabelledby: 'selectable-card-example-3',
-                name: id3,
-                onChange,
-                hasNoOffset: true
-              }}
-            >
-              <CardTitle>Third card</CardTitle>
-            </CardHeader>
-            <CardBody>This card is selectable but disabled.</CardBody>
-          </Card>
-        </Gallery>
-      </div>
+            <CardTitle>Third card</CardTitle>
+          </CardHeader>
+          <CardBody>This card is selectable but disabled.</CardBody>
+        </Card>
+      </Gallery>
     </>
   );
 };
diff --git a/packages/react-core/src/components/Card/examples/CardSingleSelectable.tsx b/packages/react-core/src/components/Card/examples/CardSingleSelectable.tsx
index 83f116e40c0..74f43c3b879 100644
--- a/packages/react-core/src/components/Card/examples/CardSingleSelectable.tsx
+++ b/packages/react-core/src/components/Card/examples/CardSingleSelectable.tsx
@@ -1,63 +1,80 @@
 import { useState } from 'react';
-import { Card, CardHeader, CardTitle, CardBody, Gallery } from '@patternfly/react-core';
+import { Card, CardHeader, CardTitle, CardBody, Gallery, Checkbox } from '@patternfly/react-core';
 
 export const SingleSelectableCard: React.FunctionComponent = () => {
   const [isChecked, setIsChecked] = useState('');
   const id1 = 'single-selectable-card-input-1';
   const id2 = 'single-selectable-card-input-2';
   const id3 = 'single-selectable-card-input-3';
+  const [displayRadioButton, setDisplayRadioButton] = useState(false);
 
   const onChange = (event: React.FormEvent<HTMLInputElement>) => {
     setIsChecked(event.currentTarget.id);
   };
 
+  const toggleHide = (checked: boolean) => {
+    setDisplayRadioButton(checked);
+  };
+
   return (
-    <Gallery hasGutter>
-      <Card id="single-selectable-card-example-1" isSelectable isSelected={isChecked === id1}>
-        <CardHeader
-          selectableActions={{
-            selectableActionId: id1,
-            selectableActionAriaLabelledby: 'single-selectable-card-example-1',
-            name: 'single-selectable-card-example',
-            variant: 'single',
-            onChange,
-            hasNoOffset: true
-          }}
-        >
-          <CardTitle>First card</CardTitle>
-        </CardHeader>
-        <CardBody>This card is single selectable.</CardBody>
-      </Card>
-      <Card id="single-selectable-card-example-2" isSelectable isSelected={isChecked === id2}>
-        <CardHeader
-          selectableActions={{
-            selectableActionId: id2,
-            selectableActionAriaLabelledby: 'single-selectable-card-example-2',
-            name: 'single-selectable-card-example',
-            variant: 'single',
-            onChange,
-            hasNoOffset: true
-          }}
-        >
-          <CardTitle>Second card</CardTitle>
-        </CardHeader>
-        <CardBody>This card is single selectable.</CardBody>
-      </Card>
-      <Card id="single-selectable-card-example-3" isSelectable isDisabled isSelected={isChecked === id3}>
-        <CardHeader
-          selectableActions={{
-            selectableActionId: id3,
-            selectableActionAriaLabelledby: 'single-selectable-card-example-3',
-            name: 'single-selectable-card-example',
-            variant: 'single',
-            onChange,
-            hasNoOffset: true
-          }}
-        >
-          <CardTitle>Third card</CardTitle>
-        </CardHeader>
-        <CardBody>This card is single selectable but disabled.</CardBody>
-      </Card>
-    </Gallery>
+    <>
+      <Checkbox
+        label="Hide radio button"
+        isChecked={displayRadioButton}
+        onChange={(_event, checked) => toggleHide(checked)}
+        id="single-select-toggle-hide-radio-button"
+        name="toggle-hide"
+      />
+      <Gallery hasGutter style={{ marginTop: '15px' }}>
+        <Card id="single-selectable-card-example-1" isSelectable isSelected={isChecked === id1}>
+          <CardHeader
+            selectableActions={{
+              selectableActionId: id1,
+              selectableActionAriaLabelledby: 'single-selectable-card-example-1',
+              name: 'single-selectable-card-example',
+              variant: 'single',
+              onChange,
+              hasNoOffset: true,
+              isHidden: displayRadioButton
+            }}
+          >
+            <CardTitle>First card</CardTitle>
+          </CardHeader>
+          <CardBody>This card is single selectable.</CardBody>
+        </Card>
+        <Card id="single-selectable-card-example-2" isSelectable isSelected={isChecked === id2}>
+          <CardHeader
+            selectableActions={{
+              selectableActionId: id2,
+              selectableActionAriaLabelledby: 'single-selectable-card-example-2',
+              name: 'single-selectable-card-example',
+              variant: 'single',
+              onChange,
+              hasNoOffset: true,
+              isHidden: displayRadioButton
+            }}
+          >
+            <CardTitle>Second card</CardTitle>
+          </CardHeader>
+          <CardBody>This card is single selectable.</CardBody>
+        </Card>
+        <Card id="single-selectable-card-example-3" isSelectable isDisabled isSelected={isChecked === id3}>
+          <CardHeader
+            selectableActions={{
+              selectableActionId: id3,
+              selectableActionAriaLabelledby: 'single-selectable-card-example-3',
+              name: 'single-selectable-card-example',
+              variant: 'single',
+              onChange,
+              hasNoOffset: true,
+              isHidden: displayRadioButton
+            }}
+          >
+            <CardTitle>Third card</CardTitle>
+          </CardHeader>
+          <CardBody>This card is single selectable but disabled.</CardBody>
+        </Card>
+      </Gallery>
+    </>
   );
 };