Buttons

The .ampstart-btn class are designed to use within <button>tag.

<button class="ampstart-btn">Primary</button>
<button class="ampstart-btn ampstart-btn-secondary">Secondary</button>
                  

Button tags

<a class="ampstart-btn" href="#" role="button">Link</a>
<button class="ampstart-btn" type="submit">Button</button>
<input class="ampstart-btn" type="submit" value="Submit">
<input class="ampstart-btn" type="reset" value="Reset">
                

Outline button

Use the.ampstart-btn ampstart-btn-secondary class within <button>tag for outline button.

 
<button class="ampstart-btn ampstart-btn-secondary">Secondary</button>
                              

Sizes

<div class="flex flex-column py2">
  <button type="button" class="ampstart-btn my1">Primary button</button>
  <button type="button" class="ampstart-btn ampstart-btn-secondary my1">Secondary button</button>
</div>
                

Disabled state

Make buttons look inactive by adding the disabled boolean attribute to any <button> element.

<button class="ampstart-btn" disabled>SUBMIT</button>
<button class="ampstart-btn ampstart-btn-secondary" disabled>SUBMIT</button>