Basics
The header is firmly anchored and fixed in the upper part. The head moves with scrolling, so that all functions are visible and selectable. The header-Organism always consists of 3 molecules.
1. Navigation molecules,
2. Logo molecules
3. Toolbar molecules.
The header-organism
The header-molecules
The header-atoms
Header breakpoints
All Headers are divided into different breakpoints. The breakpoints define the visual division and distance of organisms, molecules and atoms from each other in all possible digital formats. This UI design kit considers the Web_Max breakpoint as default, all other breakpoints are located in the category subcategories.
Kiosk Header
Web_Max Header
Web_Min Header
Tablet Header
Mobile Header
Header theming
All molecules and atoms of the Header exist in two themes, the Astronaut(light) and the Tokyo at Night Theme(dark).
Astronaut theme
Tokyo at night theme
Header variation inside EgdeOne and X-Series
The atoms of each molecule may differ within the X-Series and EdgeOne.
The EgdeOne header-atoms
The X-Series header-atoms
EdgeOne Astronaut Header
X-Series Astronaut Header
