# EuiContentCardHeaderStartComponent

**Type:** component

<p>Container for content placed at the start (left side) of the card header. Typically used for status indicators, badges, or icons.</p>
<h3>With Status Chip</h3>
<b>Example :</b><div><pre class="line-numbers"><code class="language-html">&lt;eui-content-card-header-start&gt;
    &lt;eui-chip euiSizeS&gt;Active&lt;/eui-chip&gt;
&lt;/eui-content-card-header-start&gt;</code></pre></div><h3>With Icon</h3>
<b>Example :</b><div><pre class="line-numbers"><code class="language-html">&lt;eui-content-card-header-start&gt;
    &lt;eui-icon-svg icon=&quot;document&quot; size=&quot;m&quot;/&gt;
&lt;/eui-content-card-header-start&gt;</code></pre></div><h3>Accessibility</h3>
<ul>
<li>Ensure status indicators have appropriate text or ARIA labels</li>
<li>Icons should have descriptive labels when conveying important information</li>
</ul>
<h3>Notes</h3>
<ul>
<li>Positioned at the start of the header before the title</li>
<li>Commonly used for visual status indicators or categorization</li>
<li>Content is automatically aligned and spaced</li>
</ul>


**Selector:** `eui-content-card-header-start`

**Standalone:** false
