Greyedout

Greyed-out, also written as grayed-out or greyed out, is a term used to describe a user interface element that appears visually de-emphasized to indicate it is not currently available or applicable. A greyed-out control is typically non-interactive; users cannot activate it, and it often does not respond to input. The appearance usually involves a lighter grey color and reduced contrast compared with enabled controls.

Common contexts for greyed-out elements include software applications, websites, forms, and dashboards. They signal conditions such as missing required information, insufficient permissions, or options that do not apply in the current context. For example, a Save button may be greyed out until a user completes required fields, or a menu item may be greyed out until an appropriate selection is made.

Design and accessibility considerations emphasize that color alone should not convey state. States should be communicated with additional cues such as text labels, icons, tooltips, or patterns, and proper semantics should be provided for assistive technologies. In web design, ARIA attributes (for example, aria-disabled) can help convey non-interactive status to screen readers, while keyboard users should be able to navigate the interface with clear focus behavior and predictable responses.

Etymology and usage notes: the spelling varies by region—greyed-out (British) and grayed-out (American)—and the phrasing is often hyphenated. The underlying concept is to indicate a disabling or inapplicable state without removing the element from the interface.