# EuiOverlayFooterComponent

**Type:** component

<p>Footer component for <code>eui-overlay</code> that provides a structured bottom section.
Typically contains action buttons such as submit, cancel, or other footer controls.
Applies consistent styling and spacing for overlay footer content.
Must be used as a direct child of <code>eui-overlay</code> to maintain proper layout structure.</p>
<h3>Basic Usage</h3>
<b>Example :</b><div><pre class="line-numbers"><code class="language-html">&lt;eui-overlay [isActive]=&quot;true&quot;&gt;
  &lt;eui-overlay-content&gt;
    &lt;p&gt;Content&lt;/p&gt;
  &lt;/eui-overlay-content&gt;
  &lt;eui-overlay-footer&gt;
    &lt;button euiButton euiPrimary&gt;Save&lt;/button&gt;
    &lt;button euiButton euiSecondary&gt;Cancel&lt;/button&gt;
  &lt;/eui-overlay-footer&gt;
&lt;/eui-overlay&gt;</code></pre></div><h3>Accessibility</h3>
<ul>
<li>Action buttons should have clear labels</li>
<li>Primary action typically comes first in DOM order</li>
</ul>
<h3>Notes</h3>
<ul>
<li>Must be direct child of <code>eui-overlay</code></li>
<li>Commonly used for action buttons</li>
</ul>


**Selector:** `eui-overlay-footer`

**Standalone:** false
