Dropdown menu

A dropdown menu presents a list of options from which the user can select one. The selected option is a step towards taking action, such as saving, editing, or deleting.

Dimensions

Dimensions of the dropdown list and items are the same as Soul use in selects.

Submenus

By default, the submenu opens down and overlaps the main menu. The first item is aligned with the parent item from the main menu.

If the dropdown menu is close to the bottom of the screen, the direction is changed, and the submenu opens up. In this case, the last item is aligned with the parent item.

Soul Design System by Emplifi

Soul is the heart of Emplifi's effort to design the best CX platform for its customers. The design system collects principles, components, patterns, copywriting guidelines, and more.

Emplifi Design team
Emplifi Design blog
Figma Community

Soul Storybook
Report issue