Skip to main content


Toolbar is a group of buttons or icons put together to have multiple actionable items in a place.


A total of four different toolbars are available in GEL.

Toolbar types


Toolbar demo


  • Toolbar are in genaral floated towards the right of the infographic/charts and tables.
  • All icons should be accompanied with a tooltip.
  • There can be multiple toolbars exisiting together with different functionalities.
  • Additional actionable items/icon that are less important can be hidden under the ellipse sign.
  • The gap between control-buttons on the same line is spacer-2.

When to use

  • Toolbar are uesd to add more actionable content to a given chart/infographic.

Designer assets

Hey Designers, please find the Figma assets here. If you want permission to access the file, please contact Experience Design CoP.

Developer API

Hey Developers, find out the tech documentation of this compoment on PrimeVue. If you have issue, please contact Development CoP