Clearing the focus outline

By default, browsers give input elements like buttons and inputs an outline when they’re focused. You can remove this outline and more generally change what the focus state looks like:

1. Select the button.
2. In Element States, select Focus.

That’s actually it, you don’t need to change anything about the Focus state. By default, buttons have an outline, but when you set a Focus state, it clears out the default outline. (And then if you want, you can use shadows to add your own outline.)

Have feedback on this page? Let us know on our forum.