Contents Menu Expand Light mode Dark mode Auto light/dark, in light mode Auto light/dark, in dark mode Skip to content
marimo
Light Logo Dark Logo
  • Getting Started
  • Guides
    • Overview
    • Reactivity
    • Interactivity
    • SQL
    • Run as an app
    • Run as a script
    • Outputs
    • Dataframes
    • Plotting
    • Editor features
      • Editor overview
      • Package management
      • AI completion
      • Hotkeys
    • Theming
    • Best practices
      • Performance
    • Coming from other tools
      • Coming from Jupyter
      • Coming from Jupytext
      • Coming from Papermill
      • Coming from Streamlit
    • Integrating with marimo
      • Richly display objects
      • Custom UI elements
    • Reactive state
    • Online playground
    • Exporting
    • Configuration
      • Runtime configuration
    • Troubleshooting
    • Deploying
  • Recipes
  • API Reference
    • Markdown
    • Inputs
      • Array
      • Batch
      • Button
      • Chat
      • Checkbox
      • Code Editor
      • Dataframe
      • Data Explorer
      • Dates
      • Dictionary
      • Dropdown
      • File
      • File Browser
      • Form
      • Microphone
      • Multiselect
      • Number
      • Radio
      • Range Slider
      • Refresh
      • Run Button
      • Slider
      • Switch
      • Table
      • Tabs
      • Text
      • Text Area
      • Custom UI elements
    • Layouts
      • Accordion
      • Carousel
      • Callout
      • Justify
      • Lazy
      • Plain
      • Routes
      • Sidebar
      • Stacks
      • Tree
    • Plotting
    • Media
      • Image
      • Audio
      • Video
      • PDF
      • Download Media
      • Plain text
    • Diagrams
    • Status
    • Outputs
    • Control flow
    • HTML
    • Query Parameters
    • Command Line Arguments
    • Caching
    • State
    • App
    • Cell
    • Miscellaneous
  • FAQ
  • Examples
  • Integrations
    • Google Cloud Storage
    • Google Cloud BigQuery
    • Google Sheets
  • Community

Links

  • GitHub
  • Discord
  • Newsletter
  • Twitter
  • Marimo Cloud Waitlist
  • Blog
Back to top
View this page
Edit this page

Navigation Menu¶

marimo.nav_menu(menu: dict[str, typing.Union[typing.Mapping[str, typing.Union[typing.Mapping[str, ForwardRef('JSONType')], typing.Sequence[ForwardRef('JSONType')], str, int, float, bool, object, marimo._output.mime.MIME, NoneType]], typing.Sequence[typing.Union[typing.Mapping[str, ForwardRef('JSONType')], typing.Sequence[ForwardRef('JSONType')], str, int, float, bool, object, marimo._output.mime.MIME, NoneType]], str, int, float, bool, object, marimo._output.mime.MIME, NoneType]], *, orientation: Literal['horizontal', 'vertical'] = 'horizontal') → Html¶

Navigation menu component.

This is useful for creating a navigation menu with hyperlinks, most used when creating multi-page applications, with marimo.create_asgi_app (docs).

Examples.

nav_menu = mo.nav_menu(
    {
        "/overview": "Overview",
        "/sales": f"{mo.icon('lucide:shopping-cart')} Sales",
        "/products": f"{mo.icon('lucide:package')} Products",
    }
)

You can also nest dictionaries to create submenus¶

nav_menu = mo.nav_menu(
    {
        "/overview": "Overview",
        "Sales": {
            "/sales": "Overview",
            "/sales/invoices": {
                "label": "Invoices",
                "description": "View invoices",
            },
            "/sales/customers": {
                "label": "Customers",
                "description": "View customers",
            },
        },
    }
)

Args.

  • menu: a dictionary of tab names to tab content; the content can also be nested dictionaries (one level deep) strings are interpreted as markdown

Returns.

  • An Html object.

Copyright © 2024, marimo-team
Made with Sphinx and @pradyunsg's Furo
On this page
  • Navigation Menu
    • nav_menu()