---
layout: component
type: component
title: Separator 
---

<div class="separator separator-alt">
  <div class="separator-center_piece">
  </div>
</div>

<pre>
  <code>
    &lt;div class="separator separator-alt">
      &lt;div class="separator-center_piece">
      &lt;/div>
    &lt;/div>
  </code>
</pre>

---
layout: component
type: component
title: Separator
---

<div class="separator separator-alt">
  <div class="separator-center_piece">
  </div>
</div>

<div class="separator separator-alt">
  <div class="separator-center_piece">
    <div class="hexagon hexagon-alt"></div>
  </div>
</div>

<pre>
  <code>
    &lt;div class="separator separator-alt">
      &lt;div class="separator-center_piece">
      &lt;/div>
    &lt;/div>
  </code>
</pre>

Add hexagon in separate documentation
Add hexagon in separate documentation

Shows different ways to use separators.
