Color pallete

Posted by: pedro.moraes on 27 April 2023, 1:11 am EST

    • Post Options:
    • Link

    Posted 27 April 2023, 1:11 am EST - Updated 27 April 2023, 1:17 am EST

    How do I access a color palette and modify the default texts and standard colors?

  • Posted 27 April 2023, 11:22 pm EST


    You can change the default text of the color picker by changing the corresponding properties in the designer resources. You can get designer resources using GC.Spread.Sheets.Designer.getResources() method and set the modified resources using GC.Spread.Sheets.Designer.setResources() method.

    Please refer to the code snippet.

    let res = GC.Spread.Sheets.Designer.getResources();
    res.colorPicker.moreColorsText = 'MORE COLORS';
    res.colorPicker.standardColorsTitle = "STANDARD COLORS";
    res.colorPicker.themeColorsTitle = "THEME COLORS";

    Please note that you can not change standard colors in the color picker as they are rendered by a designer component. To change the standard colors in color picker, you would need to create a custom color picker and register that component to designer.

    Please refer to to know more about custom components.


    Doc references:





  • Posted 28 April 2023, 12:40 am EST

    Could you send me an example of creating a color component exactly like the existing one? That I can change the default colors

    This example command does not work

    new GC.Spread.Sheets.Designer.AtomicComponentBase();

    It shows “Property ‘Designer’ does not exist on type ‘typeof Sheets’.”

    I need to use it this way:

    new Designer.Spread.Sheets.Designer.AtomicComponentBase();

    But shows “Expected 2 arguments, but got 0.”

  • Posted 30 April 2023, 11:18 pm EST


    It may be showing “Property ‘Designer’ does not exist on type ‘typeof Sheets’” because the type definition for that is not available. You can specify GC.Spread.Sheets as any to avoid this error.

    Please note that the color picker is a built-in component and it does not support customization. It is important to note that the standard colors in color picker component are shown as per MS Excel which is by design.

    You can change the standard colors in color picker by changing the background color and “color” attribute of html elements which show colors in color picker


    Please refer to the code snippet and attached sample.

    // changes standard colors in color picker as per specified colors
    function changeStandardColors(colors) {
        let colorElements = document.querySelectorAll('[group-name="Standard Colors"]');
        for (let index = 0; index < 10; index++) {
            let element = colorElements[index];
   = colors[index];
            element.setAttribute('color', colors[index]);


    Please let us know if you still face any issues.



Need extra support?

Upgrade your support plan and get personal unlimited phone support with our customer engagement team

Learn More

Forum Channels