Testing - Button

Button Element

Using: <button>

Primary Button (SM)
Primary Button (MD)
Primary Button (LG)
Secondary Button (SM)
Secondary Button (MD)
Secondary Button (LG)
Tertiary Button (SM)
Tertiary Button (MD)
Tertiary Button (LG)

Anchor Element

Using: <a>

Primary Anchor (SM) Normal Focused Hover Pressed Disabled
Primary Anchor (MD) Normal Focused Hover Pressed Disabled
Primary Anchor (LG) Normal Focused Hover Pressed Disabled
Secondary Anchor (SM) Normal Focused Hover Pressed Disabled
Secondary Anchor (MD) Normal Focused Hover Pressed Disabled
Secondary Anchor (LG) Normal Focused Hover Pressed Disabled
Tertiary Anchor (SM) Normal Focused Hover Pressed Disabled
Tertiary Anchor (MD) Normal Focused Hover Pressed Disabled
Tertiary Anchor (LG) Normal Focused Hover Pressed Disabled

Link Element

Using: <a href="#">

Primary Anchor (SM) Normal Focused Hover Pressed Disabled
Primary Anchor (MD) Normal Focused Hover Pressed Disabled
Primary Anchor (LG) Normal Focused Hover Pressed Disabled
Secondary Anchor (SM) Normal Focused Hover Pressed Disabled
Secondary Anchor (MD) Normal Focused Hover Pressed Disabled
Secondary Anchor (LG) Normal Focused Hover Pressed Disabled
Tertiary Anchor (SM) Normal Focused Hover Pressed Disabled
Tertiary Anchor (MD) Normal Focused Hover Pressed Disabled
Tertiary Anchor (LG) Normal Focused Hover Pressed Disabled

Button Input Element

Using: <input type="button" />

Primary Anchor (SM)
Primary Anchor (MD)
Primary Anchor (LG)
Secondary Anchor (SM)
Secondary Anchor (MD)
Secondary Anchor (LG)
Tertiary Anchor (SM)
Tertiary Anchor (MD)
Tertiary Anchor (LG)

Submit Input Element

Using: <input type="submit" />

Primary Anchor (SM)
Primary Anchor (MD)
Primary Anchor (LG)
Secondary Anchor (SM)
Secondary Anchor (MD)
Secondary Anchor (LG)
Tertiary Anchor (SM)
Tertiary Anchor (MD)
Tertiary Anchor (LG)

Reset Input Element

Using: <input type="reset" />

Primary Anchor (SM)
Primary Anchor (MD)
Primary Anchor (LG)
Secondary Anchor (SM)
Secondary Anchor (MD)
Secondary Anchor (LG)
Tertiary Anchor (SM)
Tertiary Anchor (MD)
Tertiary Anchor (LG)

Various Element Children

Supported Markup

The following examples are supported and should have correct spacing.


Unsupported Markup

The following examples are not supported for button children spacing.