Skip to content

Design

Design principles serve as guiding notions that shape the design of the Shopify admin, with Polaris providing support in implementing these principles effectively.

Pro design language
Efficiency, intuition, and style combined to empower merchants with data-rich views, action-driven interfaces, and dynamic interactions.
Color
Color highlights important areas, communicates status, urgency, and directs attention.
Depth
Depth introduces a sense of realism, helps establish visual hierarchy, and creates focus.
Icons
Icons enhance an experience by providing intuitive and efficient navigation, conveying information concisely, and making it more visually appealing.
Layout
Layout determines the placement, positioning, and organization of various components within the UI, such as buttons, menus, content sections, and other visual elements.
Motion
Motion brings dynamism to an interface, offers visual feedback, and aids merchants understanding the outcomes of their actions.
Typography
Typography is the art of arranging type in ways that provides innate hierarchy to UI.
Data visualizations
Visualizations surface patterns in data, and provide immediate answers to a single, specific question.
Illustrations
The Shopify admin uses a precise illustration style to help merchants quickly and clearly understand how things work across every experience.
Interaction states
Interaction states communicate the status of an element in the interface, establish confidence once an action is taken, and suggest the ability (or inability) to interact with the element.
Sounds
We use sound to communicate information and to enhance how merchants experience the Shopify admin. Sound patterns make interactions easier and more predictable.