Mozilla Protocol
  • 22.0.0

Button: With Sizes

Sizes from sm to xl are available.

Large is the default size.

Use small button sparingly because they are harder to read and a smaller tap target.

Also use extra large button sparingly.

<p>
    <button class="mzp-c-button mzp-t-sm" type="button">Learn more</button>
</p>

<p>
    <button class="mzp-c-button mzp-t-md" type="button">Learn more</button>
</p>

<p>
    <button class="mzp-c-button mzp-t-lg" type="button">Learn more</button>
</p>

<p>
    <button class="mzp-c-button mzp-t-xl" type="button">Learn more</button>
</p>