Pages
Introduction Colors & Tokens Icons
UI
Button Link Badge Notification Badge Alert Card Spinner Avatar Divider Empty State
Interactive
Modal Side Modal Dropdown Tooltip Accordion Tabs Flash Toast Support Button
Forms
Form Select Toggle Checkbox & Radio Text Fields Date & Time Fields
Layout
Navbar Sidebar Table Pagination Breadcrumbs Selector List
Utilities
Local Time
app_theme v1.39.1

Navbar

Sticky top navigation with leading , app_links and actions slots.

With app links and actions

Leads Intake
CRM 3
EO
= app_theme_navbar(logo_url: "#") do |nav|
  - nav.with_app_link do
    = app_theme_navbar_app_link "Leads", href: "#", active: true
  - nav.with_app_link do
    = app_theme_navbar_app_link "Intake", href: "#"
  - nav.with_app_link do
    = app_theme_navbar_app_link(href: "#") do
      = app_theme_notification_badge "CRM", badge: 3
  - nav.with_actions do
    = app_theme_avatar(initials: "EO", size: :sm)

The bar at the top of this site is a live app_theme_navbar with a leading slot holding app_theme_sidebar_expand_btn .