Getting Started
Overview
Installation
Theme
Forms
Basic Inputs
Custom Inputs
Select
Components
Components
78
Micro Charts
Navigation
Libraries
Content Editor
Data View
Form Builder
Image Designer
Kanban Board
PDF Viewer
Video Player
Visual Builder
Latest npm version of @ngstarter-ui/componentsWeekly npm downloads of @ngstarter-ui/components
Buy License

Rail Navigation

Rail Navigation provides a compact vertical navigation rail with icons and short labels. Use it when the app or workspace needs navigation but there is not enough space for a full sidebar.

Use it for narrow editor or workspace navigation, secondary product navigation, compact admin shells, and switching between primary sections.

Do not use Rail Navigation when you need a full sidebar with groups, nested navigation, or supporting content; use Sidebar or Sidenav. Do not place it inside ngs-sidebar, because Sidebar has its own navigation. Use Navigation for normal section navigation in content.

The NgStarter Angular Rail Nav component lets you provide a compact vertical navigation rail with icons and short labels. Use ngs-rail-nav when an app or workspace shell needs compact vertical navigation but there is not enough space for a full sidebar. It includes examples for Basic rail navigation, Rail navigation customization, Basic rail nav, and Rail nav customization.

Basic rail navigation

Use basic rail navigation for compact vertical navigation with icons and short labels.

Rail navigation customization

Customize rail navigation styling when the compact rail must match a workspace or product shell.