Pasek nawigacyjny zawsze ma wysokość minimum 50px oraz standardowe marginesy wewnętrzne oraz zewnętrzne z wyjątkiem górnego (lub dolnego w przypadku menu przypiętego u dołu ekranu).
Nawigacja zawsze posiada jednobarwne tło z palety kolorów o nasyceniu 100% z przezroczystością wynoszącą 80% oraz efektem rozmycia.
Tło rozwijanych menu powinno być przezroczyste bez efektu rozmycia.
Nawigacja posiada cień dolny zgodny z definicją cienia.
Tekst powinien być napisany kontrastującym kolorem (najlepiej białym lub czarnym).
Aktywne elementy powinny mieć tło podbite lub zredukowane o 20%.
Aby osiągnąć odpowiednie ostylowanie aktywnych elementów za pomocą CSS można użyć specjalnej klasy CSS, która definiuje czy nasz nagłówek jest "jasny" czy "ciemny".
Odpowiednie klasy to .imd-nav-light oraz .imd-nav-dark.
Aby przypiąć menu do góry ekranu należy głównemu elementowi nav nadać klasę .imd-nav-fixed oraz odpowiednio:
.imd-nav-top dla menu przypiętego u góry ekranu lub .imd-nav-bottom dla menu przypiętego u dołu ekranu.
Istnieje możliwość wymuszenia mobilnego stylu nawigacji (hamburger menu) na wyższych rozdzielczosciach.
Umożliwiają to odpowiednio klasy: .imd-nav-mobile-xl, .imd-nav-mobile-lg oraz .imd-nav-mobile-md.
System IcyMat Design obejmuje także tworzenie ikon nawigacyjnych.
Ikona nawigacyjna posiada tylko i wyłącznie piktogram z predefiniowanego zestawu znaków i ma kształt kwadratu.
Piktogram powinien być wyśrodkowany zarówno w pionie jak i poziomie.
Rozmiar ikony nawigacyjnej to 33% wielkości pływającej ikony natomiast cała ikona posiada marginesy równe marginesom elementu pływającego.
Aby utworzyć ikonę nawigacyjną z samym obrysem należy dodać do niej klasę .imd-nav-icon-outline oraz ustawić kolor obramowania i ikony na taki sam.