Buttons > Button updates

Update styling of buttons to make them look more modern, things to explore:

• Reduce font-size in combination with increasing font weight to give buttons a more compact, yet visually stronger and distinct presence in the UI. This change makes them more identifiable and "button-like."

• Updates to default button in light mode (getting rid of skeleton look) to make it more distinct from some containers and form elements.

• Increase border radius for a more modern look (related to other design token work). Border radius isn’t just for approachability or a modern touch aesthetic. Increasing border radius creates “air pockets” that adds perceived space in a condensed UI without actually increasing space between elements. The increase in perceived space means elements could be closer together while remaining distinct. At the same time, the space created by rounding the corners creates stronger visual breaks when scanning actions. In the comparison below the horizontal spacing between buttons is the same in each row, while the perceived spacing changes.

  Border radius comparison

  

A follow-up will be to also look into reducing the numbers of variants in Buttons > Exploring reducing the number of vari... (#2013)

Exploration: