# EuiDashboardCardContentComponent

**Type:** component

<p>Custom content container for EuiDashboardCard that enables fully customized card layouts.
Use this when the default card structure doesn&#39;t meet your needs and you want complete control
over the card&#39;s internal structure with header, body, and footer sections.</p>
<h3>Complete Custom Card</h3>
<b>Example :</b><div><pre class="line-numbers"><code class="language-html">&lt;eui-dashboard-card&gt;
  &lt;eui-dashboard-card-content&gt;
    &lt;eui-dashboard-card-content-header&gt;
      &lt;eui-dashboard-card-content-header-icon icon=&quot;chart-line:regular&quot;/&gt;
      &lt;eui-dashboard-card-content-header-title&gt;
        Sales Overview
      &lt;/eui-dashboard-card-content-header-title&gt;
      &lt;eui-dashboard-card-content-header-action&gt;
        &lt;eui-icon-button icon=&quot;eui-ellipsis-vertical&quot; size=&quot;s&quot;/&gt;
      &lt;/eui-dashboard-card-content-header-action&gt;
    &lt;/eui-dashboard-card-content-header&gt;
    &lt;eui-dashboard-card-content-body&gt;
      &lt;div class=&quot;eui-u-f-2xl-bold&quot;&gt;$24,500&lt;/div&gt;
      &lt;div class=&quot;eui-u-flex&quot;&gt;
        &lt;eui-icon-svg icon=&quot;arrow-up:regular&quot; fillColor=&quot;success&quot; size=&quot;xs&quot;/&gt;
        &lt;span class=&quot;eui-u-c-s-success&quot;&gt;+12% vs last month&lt;/span&gt;
      &lt;/div&gt;
    &lt;/eui-dashboard-card-content-body&gt;
    &lt;eui-dashboard-card-content-footer&gt;
      &lt;a class=&quot;eui-u-text-link&quot; href=&quot;/reports&quot;&gt;View full report&lt;/a&gt;
    &lt;/eui-dashboard-card-content-footer&gt;
  &lt;/eui-dashboard-card-content&gt;
&lt;/eui-dashboard-card&gt;</code></pre></div><h3>Accessibility</h3>
<ul>
<li>Maintains semantic structure with header, body, and footer sections</li>
<li>Ensure interactive elements within have proper labels</li>
<li>Use heading elements in title section for proper document outline</li>
</ul>
<h3>Notes</h3>
<ul>
<li>Provides complete flexibility for complex dashboard card layouts</li>
<li>Combine with sub-components for structured content organization</li>
<li>Use when default card props (label, subLabel, etc.) are insufficient</li>
<li>Supports all dashboard card variants and sizes via parent component</li>
</ul>


**Selector:** `eui-dashboard-card-content`

**Standalone:** false
