States are visual representations used to communicate the status of a component or interactive element.States communicate the status of UI elements to the user. Each state should be visually similar and not drastically alter a component, but must have clear affordances that distinguish it from other states and the surrounding layout.

‍