[Fixed] Angular PrimeNG menubar: Hide default down arrows next to menu titles


The default PrimeNG menubar includes a little down arrow next to every main menu title. I want to remove the down arrows completely from the top-level menu title. Nested sub-menus may display a right arrow to show there is a sub-menu, and those can stay. Here are some screenshots with default menubar:

PrimeNG Menubar Arrows


I can change the icons in the menu items easily, but can’t find a handle to change/hide the arrows.

I’m using Angular CLI 9.1.8 and PrimeNG 9.1.0.

StackBlitz does not work with PrimeNG due to error: ngcc failed to run on [email protected].


to hide it in style.css change its content like

   content: "";

check in developer console inspect element font name then make its before css as content: "";

Leave a Reply

(*) Required, Your email will not be published