Application launcher

The Application launcher an easy access to open different applications. It is accessible at the top-right in the Topbar.

Variations

The Application launcher is a part of the Topbar, and is an easy access to apps in addition to a full screen launcher. The amount of app displayed may vary based on the screen size (4x4 vs 3x3).

Application launcher in Topbar

The application launcher is accessible from the Topbar.

Specs

How the application launched are built up and styled.

Anatomy

The Application launcher is built up by multiple UI components. 

Colors

Bright

Element

Color / Style name

1

Topbar border + Text

color-ui-element-active

2

Container

color-ui-container-global

3

Outline

color-ui-border-outline

4

Container button

color-ui-container-section

5

Icon

color-ui-element-neutral

Typography and icons

Bright

Text category

Text attributes

1

Body

AA

Typeface: Open Sans

Weight: Regular

Size: 16px

Lineheight: 24px

2

Apps icon

Name: Apps

Size: 24px

Measures and spacing

Note that the top-border lays on top of the bottom-border in the Topbar.