Skip to main content


  • Accordion - A navigational device which presents a hierarchical set of items in which only a single branch of that hierarchy is exposed at one time.
  • Action Button - A UI control allowing users to trigger actions by clicking, tapping, or pressing a corresponding key on a keyboard, such as “Enter.”
  • Activation - The manner in which users invoke an action on the currently selected object(s).
  • Alarm - The most critical alert category. Indicates that a condition exists which requires immediate operator action.
  • Alert - Indication of a condition regarding people, systems, or the mission, categorized into alarms, warnings, events, and informational messages.
  • Application State - A tag on the Global Status Bar that presents what state the application is in, such as Production, Review, or Testing.


  • Button - A Button allows users to trigger actions by clicking, tapping, or pressing a corresponding key on a keyboard, such as “Enter.”


  • Cards - A container for short, related pieces of information.
  • Checkbox - A Checkbox allows a user to select a value from a small set of options.
  • Classification & Control Markings - Markings required to be present on software that includes controlled or classified information.
  • Clock - Clock shows the current date and time, and optional AOS and LOS timers.
  • Close Button - A UI component that, when activated, dismisses a Dialog .
  • Color Palettes - The list of color values used in and approved by the Astro design system.
  • Compliance - A list of rules used to determine if products align with Astro design and usage patterns.
  • Container - An object that holds other objects.
  • Concept Sketch - A sketch on paper that lays out the main content workspace and controls and clarifies the flow of user interaction from screen-to-screen.


  • Data Visualization - The goal of Data Visualization is to make complex information accessible and easy to digest in a visual manner.
  • Default Action - The action that users would most likely want to execute in the window with focus.
  • Design Tokens - A pairing of the same code and visual properties in a format that is deployable across all platforms, acting as a single source of truth for both designers and developers.
  • Dialog - A Dialog interrupts app processing to prompt a user to confirm an action or acknowledge a piece of information. It displays information along with a set of buttons allowing users to accept or cancel the actions presented within the Dialog.


  • Forms - A text field, input, or inputs which require interaction with the user to complete an action such as signing up for an account.


  • Global Controls - Display top-level system and equipment status throughout Astro applications.
  • Global Status Bar - A full width view across the top of an application that displays the overall health and status of a system.
  • Grid - A Grid system is a defined set of vertical columns and optionally horizontal rows based on time-tested principles of graphic design and layout.
  • Grip Handle - The part of a movable menu bar or toolbar that, when dragged, detaches the control and displays it in a separate window.


  • Icons - A graphic representation to convey meaning in a concise, visual manner.
  • Input Field - A type of field that allows users to enter text or numeric data.


  • Label - Text or a graphic that identifies an object or control.
  • Link - A link (also known as a hyperlink) is a clickable text element. The link control is used for navigation, but can also trigger an event.
  • Log - A tabular representation of application events and may include username, priority, equipment type, signal type, etc.


  • Menu - A list of options from which users choose. The options can execute commands, display a window (to request more information from users) or submenu, and specify settings.
  • Modeless Pane - A visual pattern used to present temporary interactions inline and does not require user action before moving to another area of the page.


  • Navigation - Navigation defines how the user moves through the application and establishes their mental model of the object hierarchy.
  • Navigational Tabs - Divide major areas of content and to indicate a work process.
  • Notification Banner - Events that deserve user attention, but don’t require a response, may be displayed in a Notification Banner. The Banner displays within the user’s field-of-view, but doesn’t block other interaction.
  • Notification System - A system which generates, prioritizes, and displays event notifications for significant occurrences within an application and its associated systems and hardware.


  • Pagination - The process of dividing content for display on multiple pages. It is utilized when content, such as Search results, does not fit onto one page and must be split across multiple pages.
  • Pop Up Menu - A Pop Up Menu provides users with a quick way to access common actions for a highlighted item.
  • Progress Indicator - A Progress Indicator signals that an application is busy performing an operation.
  • Push Button - A control that initiates an action.


  • Radio Button - Allows users to mutually select an option from a predefined set of options. When one selection is made, the previous selection becomes deselected.
  • Research - Research is an essential process to a project’s success. It reveals, clarifies, and establishes the foundation on which the application resides.


  • Search - A specialized text field for entering search terms.
  • Segmented Button - Allows users to select one item at a time from two to four options.
  • Select Menu - A UI control that allows users to select a value from a list of values.
  • Sign In - A form input in which a user enters authenticating information to gain access to specific information or usage of an application.
  • Slider - A graphical control element that allows users to choose from a range of continuous and discrete values.
  • Status Indicator - Indicates the state of a device or feature in a standard and consistent way using color, shapes, labeling, and badging.
  • Status System - A combination of colors and symbols to convey the status of a system.
  • Status Tags - A version of tags using colors and keywords to denote critical system information.
  • Switch - A Switch which describes a state or value. It allows users to change a setting between two states such as “On” and “Off.”
  • Symbols - A graphical representation or glyph associated with actions, concepts, or objects such as an asterisk.


  • Tabs - Tabs in Astro Applications are used to divide major areas of content and to indicate work process.
  • Tables - A UX design mechanism comprised of rows and columns used for displaying content.
  • Tags - Small markers which often use color to identify important information at a glance, as well as filter and categorize items by keywords.
  • Textareas - A multi-line text input control often used in a form to collect user inputs like comments or reviews.
  • Theme - A preset set of colors applied as a group to the design system.
  • Timeline - Displays event information within a specified time period.
  • Title Bar - A component that displays the name for a table or window.
  • Tree - A list box that displays the hierarchical relationship among the objects in the list.
  • Typography - The font and text settings that Astro uses across the design system.


  • Validation - Ensures that data is properly entered into an Input Field or Form. It alerts users to data errors, required input, and prompts them to make corrections.


  • Wireframe - A page schematic or screen blueprint that represents the skeletal framework of a Web page or Web site.

Help us improve Astro

Please rate your present experience with Astro: