Design Foundations

Sabre animations are simple, helpful and fun. When used correctly, animations can reduce cognitive load and enhance a user’s understanding of the interface, while improving its appeal.

Color plays a very intentional role in our language and is leveraged throughout Spark to: Create Prominence, Reinforce Intuitiveness, and Convey Meaning

Icons are used throughout the Spark language to create visual interest, to make content easily scannable, and to provide access to information and actions in space-constrained contexts.

To promote a sense of visual harmony across a wide range of applications, Spark provides the following recommendations on how to combine components into complex patterns and screen layouts.

The Sabre logo is the most visible element of our identity.

Spark is a catalyst, a starting point for designers and developers who share a desire to build amazing experiences for end users of Sabre applications.

The Spark design language includes three themes:

• Light (spark.light.css)
• White Label (spark.whitelabel.css)
• Dark (spark.dark.css)

Typography is a defining feature of the Spark language. The selection of our standard font families, the incorporation of modular scale, and the use of a baseline grid are intended to introduce a m...

Our voice is human. It’s smart, friendly and straightforward. In the context of our applications, we use language that guides users and helps them advance toward achieving their goals.