Sketch widget in 4.21 - how to change color and size of the sketch tools

[MKY]

In 4.20 I used .esr-widget--button class to chage color and size. In 4.21 the sketch widget uses calcite components and calcite icon. How can I overide the default color by using css?

[JoseBanuelos · Accepted solution]

Hello @MKY ,

This is a good question. The Sketch widget is using calcite-actions, so in order to update the default color of the Sketch widget buttons, then the following css override will work. This is documented here:
https://developers.arcgis.com/calcite-design-system/foundations/colors/#primary-colors

calcite-action {
  --calcite-ui-foreground-1: rgba(240,186,180,0.5);
}

Unfortunately, you are currently unable to override the size of the calcite-actions in the Sketch widget. We are aware of this, and we are discussing how to improve this workflow.

Thanks,

Jose