Overview

Guidelines provide important advice for applying Shell's design principles to create better user experiences. Refer to these guidelines for every aspect of designing and building seamless digital products at Shell.

Accessibility

Best-practice guidance and resources for inclusive and accessible design.

Brand

Information and resources for expression of the Shell Brand.

Colour

Understand the way colour is used in the Shell Design System.

Content

Guidance and examples for writing consistent content.

Flags

Information and resources for using international flag symbols.

Iconography

Information about designing icons for digital products and services at Shell.

Illustration

Principles to explain best practices for creating illustrations.

Motion

Guidance and accessibility best practice for designing with motion.

Pictograms

Information about designing informative and decorative symbols.

Spacing

Rules and spacing tokens to ensure balanced visual design.

Themes

Basics for creating custom colour themes for specific products at Shell.

Typography

Explanation of best practices for applying typography in your designs.