Deprecated components will be removed in future major versions of Polaris. These components could be deprecated for a number of reasons and should be avoided. These components will show warnings in the component file and provide details for alternative usage. For more information, check out the component lifecycles.
Caption text is smaller than the recommended size for general reading. Used in graphs, timestamps, or as secondary text.
Contextual save barDeprecated
Informs merchants of their options once they have made changes to a form on the page or while creating a new object.
Display styles make a bold visual statement. Used for visual storytelling, marketing content, or capturing attention.
Creates the structure of the Shopify admin. All of the main sections of the admin are nested in the frame.
Used as the titles of each major section of a page in the interface, like in card components.
Legacy version of the Card component. Used to group similar concepts and tasks together for easier scanning and reading.
Legacy version of the Filters component. Used to filter the items of a list or table.
Legacy version of the Stack component. Used for layout of a horizontal row of components or vertical centering.
Used to alternate among related views within the same context.
Used to indicate to merchants that a page is loading or an upload is processing.
Used to interrupt merchants with urgent information, details, or actions.
The navigation component is used to display the primary navigation in the sidebar of the frame of an application. Navigation includes a list of links that merchants use to move between sections of the application.
Used to control a feature or option that can be turned on or off.
A large container providing actions and information contextual to the page without interrupting flow like a modal.
Used for the title of any sub-sections in top-level page sections.
Used to wrap text elements like paragraphs, headings, and lists for vertical spacing.
Enhances text with additional visual meaning, like using subdued text to de-emphasize it.
A non-disruptive message that provides quick feedback on the outcome of an action.
Appears at the top of the page and is used to brand and navigate major applications areas.
Used when an element needs to be available to assistive technology but otherwise hidden.