diff --git a/CHANGELOG.md b/CHANGELOG.md
index 6760a15f7a1..ab24926aedf 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -2,6 +2,8 @@
 
 - Added `download` glyph to `EuiIcon` ([#3364](https://github.com/elastic/eui/pull/3364))
 - Applies `max-width: 100%` to `EuiPageBody` so inner flex-based items don't overflow their containers  ([#3375](https://github.com/elastic/eui/pull/3375))
+- Added `ReactElement` to `EuiCard` `image` prop type to allow custom component ([#3370](https://github.com/elastic/eui/pull/3370))
+
 
 ## [`23.1.0`](https://github.com/elastic/eui/tree/v23.1.0)
 
diff --git a/src-docs/src/views/card/card_example.js b/src-docs/src/views/card/card_example.js
index b6df5d1eed2..3fa5564c6e3 100644
--- a/src-docs/src/views/card/card_example.js
+++ b/src-docs/src/views/card/card_example.js
@@ -154,8 +154,15 @@ export const CardExample = {
                 Make sure that all images are the{' '}
                 <strong>same proportions</strong> when used in a singular row.
               </span>
-            }
-          />
+            }>
+            <p>
+              Also, when passing an <strong>element</strong> to the{' '}
+              <EuiCode>image</EuiCode> prop that consists solely of inline
+              elements or does not contain an
+              <EuiCode>{'<img />'}</EuiCode> element, each element will require
+              a style of <EuiCode>width: 100%</EuiCode>.
+            </p>
+          </EuiCallOut>
         </div>
       ),
       props: { EuiCard },
diff --git a/src-docs/src/views/card/card_image.js b/src-docs/src/views/card/card_image.js
index 34f20c7c6da..641de21b175 100644
--- a/src-docs/src/views/card/card_image.js
+++ b/src-docs/src/views/card/card_image.js
@@ -21,7 +21,14 @@ export default () => (
     <EuiFlexItem>
       <EuiCard
         textAlign="left"
-        image="https://source.unsplash.com/400x200/?Nature"
+        image={
+          <div>
+            <img
+              src="https://source.unsplash.com/400x200/?Nature"
+              alt="Nature"
+            />
+          </div>
+        }
         title="Elastic in Nature"
         description="Example of a card's description. Stick to one or two sentences."
         footer={cardFooterContent}
diff --git a/src/components/card/_card.scss b/src/components/card/_card.scss
index bd5ab8b0c82..0b61001a0d7 100644
--- a/src/components/card/_card.scss
+++ b/src/components/card/_card.scss
@@ -149,6 +149,10 @@
     border-top-left-radius: $euiBorderRadius - 1px;
     border-top-right-radius: $euiBorderRadius - 1px;
 
+    img {
+      width: 100%;
+    }
+
     // IF both exist, position the icon centered on top of image
     + .euiCard__icon {
       position: absolute;
diff --git a/src/components/card/card.tsx b/src/components/card/card.tsx
index 03cae710e98..d435a4e9eea 100644
--- a/src/components/card/card.tsx
+++ b/src/components/card/card.tsx
@@ -17,7 +17,12 @@
  * under the License.
  */
 
-import React, { FunctionComponent, ReactElement, ReactNode } from 'react';
+import React, {
+  FunctionComponent,
+  ReactElement,
+  ReactNode,
+  isValidElement,
+} from 'react';
 import classNames from 'classnames';
 
 import { CommonProps, keysOf } from '../common';
@@ -89,9 +94,9 @@ type EuiCardProps = Omit<CommonProps, 'aria-label'> & {
   icon?: ReactElement<EuiIconProps>;
 
   /**
-   * Accepts a url in string form
+   * Accepts a url in string form or ReactElement for a custom image component
    */
-  image?: string;
+  image?: string | ReactElement;
 
   /**
    * Content to be rendered between the description and the footer
@@ -229,7 +234,15 @@ export const EuiCard: FunctionComponent<EuiCardProps> = ({
 
   let imageNode;
   if (image && layout === 'vertical') {
-    imageNode = <img className="euiCard__image" src={image} alt="" />;
+    if (isValidElement(image) || typeof image === 'string') {
+      imageNode = (
+        <div className="euiCard__image">
+          {isValidElement(image) ? image : <img src={image} alt="" />}
+        </div>
+      );
+    } else {
+      imageNode = null;
+    }
   }
 
   let iconNode;