Menu

DaisyUI

Menu is used to display a list of links vertically or horizontally.

Basic Menu

A simple vertical menu with buttons.

Horizontal Menu

Menu displayed horizontally using `menu-horizontal` class.

Menu with Active Item

Using `MenuState::Active` to highlight the active menu item.

Menu with Disabled Items

Using `MenuState::Disabled` for disabled menu items.

Menu with Focus State

Using `MenuState::Focus` for focused menu items.

Responsive Menu

Vertical on small screens, horizontal on large screens.

Menu with Icons

Menu items with SVG icons.

Code Example

use rsxui::components::{Menu, MenuItem, MenuState};

use rsx_macros::rsx;

let html = rsx! {

    <Menu class="bg-base-200 w-56 rounded-box">

        <MenuItem>"Item 1"</MenuItem>

        <MenuItem>"Item 2"</MenuItem>

        <MenuItem>"Item 3"</MenuItem>

    </Menu>

};

// Or with states:

let html = rsx! {

    <Menu class="bg-base-200 w-56 rounded-box">

        <MenuItem>"Normal item"</MenuItem>

        <MenuItem state=MenuState::Active}>"Active item"</MenuItem>

        <MenuItem state=MenuState::Disabled}>"Disabled item"</MenuItem>

    </Menu>

};

RsxUI

DaisyUI Components for Rust

Star our GitHub

Created by Isak Rickyanto@2026