Skip to content

UI patterns

Dates and times

These guidelines summarize how to display time in a way that is clear, concise, and accessible.

Empty states

Empty states are used to fill spaces when no content has been added yet, or is temporarily empty due to the nature of the feature.

Feature onboarding

Onboarding is a virtual unboxing experience that helps users get started with a feature. This is a guide for designing onboarding for the product and does not include what to do for marketing pages, email announcements, social media, etc.

Forms

Primer's form design guidelines aim to minimize the effort and cognitive load required to complete a task that requires data input from the user. For example, creating a new repo configuring settings, and logging in.

Messaging

Messaging components are used to provide important and relevant information to the user, including feedback, contextual information, product updates, and more.

Progressive disclosure

These guidelines summarize how GitHub implements progressive disclosure—an interaction design pattern that hides/shows information—as well as guiding principles, best practices, and implementation support.

Saving

Save patterns help users store and update their content and configuration throughout GitHub. These changes should be represented in the UI accurately, quickly, and obviously. Their behavior should inspire confidence and trust.