Hover states are initiated by the user pausing over an interactive element using a cursor. They can be applied to all interactive components, and should be deemphasized to avoid distracting from content.

An overlay signifies a hover state. It can be applied to the entire component, elements within a component, or as a circular shape over part of the component.