How do I get the styles of nodes?

Hi Carmen, you can get all visual properties of any node including styles in geometry-related properties: ComponentNode · Figma Developers. Specifically, if you would need to get fill style, you can use let styleId = node.fillStyleId and then import this style by ID using let styleObject = figma.getStyleById(styleId) (figma · Figma Developers).

However, if you don’t need the style itself (its properties like name etc.) and you need only its properties (color, opacity, blend mode), you can get the fills array on the node and check which properties it has.

Thanks for the reply!!

Unfortunately my node object is missing the fillStyleId property???

I think it might be related to a type problem as I’m getting this error

“Property ‘fill’ does not exist on type ‘SceneNode’.”

Which I don’t get since I’m using

const nodes = figma.currentPage.findAll(node => node.type == “COMPONENT”);

to get the node??

Carmen

My issue no is that when I try and get the style name is return an id even though I using this function . . .

let styleID = (nodes[i] as ComponentNode).fillStyleId.toString();
figma.ui.postMessage(figma.getStyleById(styleID));

I’m expect it to print out the style name, but it printing out below

Output:

1. {id: “S:35ecd45c408528c3a90cec0d6b063f76de446f29,59:0”}

2. id: “S:35ecd45c408528c3a90cec0d6b063f76de446f29,59:0”

After you get style by ID, it returns the PaintStyle type object. To get its name, simply add .name to it:

figma.ui.postMessage(figma.getStyleById(styleID).name);

Hi I faced this problem recently and I finally solved it by reading Figma’s document. This error occurs because if you use this code the plugin will crash as if no elements in project weren’t selected by users. the only thing you have to do is adding two conditions to check this matter and avoid to crash.

if (!selection) {
return;
}
if (selection.type !== ‘FRAME’) {
return;
}

This topic was automatically closed after 19 hours. New replies are no longer allowed.