Search code examples
fabricjs

How to change the default selectionColor on fabric.js?

How can I change the default bluish selectionColor on fabric.js? I've tried to change these lines in fabric.js but got no effect:

selectionColor: 'rgba(17,119,255,0.3)',
selectionBorderColor:   'rgba(255, 255, 255, 0.3)',
editingBorderColor: 'rgba(102,153,255,0.25)',

Is there any other way?

enter image description here

Solution

  • enter image description here ok, now i see what you need exactly, you want to change the border of the selected grouped object and maybe the squares on the border too.

    i tested it on kitchensink, and it works, you have to catch the selection event , and inside the event you change the borderColor and cornerColor properties of the activeGroup.

    your object:selected event:

    canvas.on('object:selected', function(o) {
    var activeObj = o.target;
    if (activeObj.get('type') == 'group') {
        activeObj.set({
            'borderColor':'#fbb802',
            'cornerColor':'#fbb802'
        });
    }
});

    hope helps, good luck.