Round corners to context menu button

I have created context menu. Now i want that first menu button from upper side and last menu button from lower side should have rounded corners. Is it possible to do? What should I use?

Are you using the “ContextMenuButton” builder?

If so, you can see how that button is defined at extensions/Buttons.js. That will tell you how you can customize it. Or you can copy it and make whatever changes you like so you can define your own builder like “ContextMenuButton”.

I think for your question you just need to set "ButtonBorder.figure": "RoundedRectangle".

Its not working. My code is

MAKE(‘ContextMenuButton’ ,
name: ‘show’,
height: 30,
‘ButtonBorder.fill’: null,
‘ButtonBorder.figure’: ‘RoundedRectangle’,
‘ButtonBorder.stroke’: null,
‘_buttonFillOver’: null,
‘_buttonStrokeOver’: null,
background: ‘white’,
shadowVisible: true,

                mouseEnter: function (e, obj) {
                  obj.background = 'grey';
                mouseLeave: function (e, obj) {
                  obj.background = 'white';



When i run this code, border is rounded but button is looking like rectangle

Can you please show what you want?


This is i want exactly. Rounded from all sides

Have the top button use the “RoundedTopRectangle” figure, and the bottom button use the “RoundedBottomRectangle” figure, shown at and available at

And set the background of the “ContextMenu” to null.