Skip to main content
mrnb
February 18, 2022
Solved

Access/Change "Selection Colors" via Plugin API

  • February 18, 2022
  • 11 replies
  • 3248 views

Hi community,

i have a question regarding “selection colors”. Is it possible to access and change the colors of figma.currentPage.selection[0] in order to change all occasions of “color x” to “color y” with one change?

So I don’t need to access every single child element and change its color there.

Thanks in advance 🙂

This topic has been closed for replies.
Best answer by tank666

Now it’s possible.
figma.getSelectionColors()

figma.com – 21 Jun 23

11 replies

Gleb
Power Member
February 18, 2022

You can’t access all colors directly like this: selection colors is a high-level feature while the API exposes mostly low-level building blocks which you can use to customize anything pretty much. I don’t see a problem in iterating over all children using something like figma.currentPage.selection[0].findAll and writing a couple of conditions inside of it.

mrnb
mrnbAuthor
February 18, 2022

Yes, you’re right. Could achieve it with findAll(((child) => child.type === ‘INSTANCE’ || child.type === ‘TEXT’|| …)

and

if ( fillStyleId === myStyle.id) { // switch colors }

Works fine for the case.

Thanks 🙂

Gleb
Power Member
February 19, 2022

Yeah, if you need only certain types of nodes, if you had access to selection colors this wouldn’t have helped anyway, since selection colors show colors from all objects within selection.

mrnb
mrnbAuthor
February 21, 2022

In this case I really wanted to recolor all elements which had a certain color. So “selection colors” would work in this case.

Gleb
Power Member
February 21, 2022

Oh, I thought you wanted only specific types of nodes judging by this part: child.type === ‘INSTANCE’ || child.type === ‘TEXT’|| … — you don’t need it if you want all nodes.

mrnb
mrnbAuthor
February 21, 2022

but I want all nodes, where I can check for an strokStyleId and fillStyleId to change them. And based on the typescript errors I get, I need to check for certain types of nodes. Don’t I?

Gleb
Power Member
February 21, 2022

Ah, for that yes. Or you can do this, not as clean but gets the job done:

if ('fillStyleId' in node) { 
  // use node.fillStyleId 
}
mrnb
mrnbAuthor
February 21, 2022

Nice, never thought about that. But is it inefficient because it iterates over every single element? Or doesn’t it impact that?

Gleb
Power Member
February 21, 2022

No, it simply checks if a property exists on an object. findAll iterates over every single node.

tank666
tank666Answer
July 26, 2023
UX/UI designer. Figma expert. Creator and developer of plugins and widgets for Figma and FigJam. Check out my resources in Figma Community: figma.com/@tank