Primary
<button type="submit" class="ecl-button ecl-button--primary"><span class="ecl-button__container"><span
class="ecl-button__label" data-ecl-label="true">Primary button</span></span></button>
Try it yourself on the playground
PlaygroundSecondary
<button type="submit" class="ecl-button ecl-button--secondary"><span class="ecl-button__container"><span
class="ecl-button__label" data-ecl-label="true">Secondary button</span></span></button>
Try it yourself on the playground
PlaygroundCall to action with icon
<button type="submit" class="ecl-button ecl-button--call"><span class="ecl-button__container"><span
class="ecl-button__label" data-ecl-label="true">Call to action button</span><svg focusable="false"
aria-hidden="true" data-ecl-icon="true"
class="ecl-button__icon ecl-button__icon--after ecl-icon ecl-icon--xs ecl-icon--rotate-90">
<use xlink:href="/dist/media/icons.db866e2e.svg#ui--corner-arrow"></use>
</svg></span></button>
Try it yourself on the playground
PlaygroundText
<button type="submit" class="ecl-button ecl-button--ghost"><span class="ecl-button__container"><span
class="ecl-button__label" data-ecl-label="true">Text button</span></span></button>
Try it yourself on the playground
PlaygroundSearch
<button type="submit" class="ecl-button ecl-button--search"><span class="ecl-button__container"><span
class="ecl-button__label" data-ecl-label="true">Search button</span></span></button>
Try it yourself on the playground
Playground