Button
Component options
https://main--spectrum-hub--adobe.aem.page/fragments/components/button/option-details
Usage guidelines
Use icons only when necessary
Icons can be used in buttons when additional clarity is required and the icon is highly relevant to the action. Icons should not be used for decoration.
Don't override color
Do not use custom colors for buttons. The colors of different button variations have been designed to be consistent and accessible
When to use static black and static white
To ensure maximum contrast with the background, use static black for light backgrounds and images, and use static white for dark backgrounds and images. Avoid placing static components on top of busy images with a lot of variance in contrast.
Don't use the pending state for long progress
The pending state should be reserved for indeterminate actions that are expected to take 5 seconds or less. For determinate or longer actions, use a progress bar or progress circle outside of the button.
Use a button group to show additional actions
Instead of a single split button (now a deprecated component), use a button group to show any additional actions related to the most critical action.
Display a popover when featuring subsequent options
In some instances, it's possible to have a call to action button display a popover (or tray) to feature subsequent options. These options should extend and parallel the action of the button. Do not include arbitrary or unrelated options.
Content standards
https://main--spectrum-hub--adobe.aem.page/fragments/components/button/content-standards