Blend Modes Not Sticking

Ask the community
1

I have a file where I’ve placed blend modes on a color fill overtop of an image fill. These were working fine until I added some new color styles.

Now when I go to change the color with the blend mode, I can change the color but the blend mode is stuck on whatever it is currently set to. I go to the blend mode, select a new one, and when I release it just goes back to the formerly set mode.

Has anyone else experienced this?

2

Same here. Blend mode on my figma files cannot be changed at the moment.
Thought it’s just me.

It worked fine changing blend modes at least 2 days ago. Now every blend modes that I applied seem to stuck at their current state and cannot be changed.

1 Like
3

This is the same experience I’m having. Occurred after adding new color styles,

4

Same here :raising_hand_man:t2:

6

Yup, I have the same problem

7

Hi all,
Sorry to hear this is happening!
It looks like a bug, please reach to our support team so they can investigate further here: https://help.figma.com/hc/en-us/requests/new

Be sure to use your Figma account email, include a link to the file, and share it with support-share@figma.com so they can take a closer look. Thank you!

8

After leaving this project alone for almost 2 weeks, I returned to it and no longer experience this issue. There was either an update during this time, restarting the app (though I believe I tried that initially), or just plain time that seemed to fix this one.

Is anyone still having this problem?

9

I tried using typescript and see the console.log, but array just detect “Normal” BlendMode. I work hard to find the bug and found Golang language (https://github.com/torie/figma/blob/8ac4168aa567/types.go#L149) and I tried again, it’s not fixed the bug.

Some example my code:

interface BlendModeObject {
PassThrough: string;
Normal: string;
Darken: string;
Multiply: string;
LinearBurn: string;
ColorBurn: string;
Lighten: string;
Screen: string;
LinearDodge: string;
ColorDodge: string;
Overlay: string;
SoftLight: string;
HardLight: string;
Difference: string;
Exclusion: string;
Hue: string;
Saturation: string;
Color: string;
Luminosity: string;
}

// Buat objek BlendMode yang sesuai dengan objek BlendModeObject
const BlendMode: BlendModeObject = {
PassThrough: “PASS_THROUGH”,
Normal: “NORMAL”,
Darken: “DARKEN”,
Multiply: “MULTIPLY”,
LinearBurn: “LINEAR_BURN”,
ColorBurn: “COLOR_BURN”,
Lighten: “LIGHTEN”,
Screen: “SCREEN”,
LinearDodge: “LINEAR_DODGE”,
ColorDodge: “COLOR_DODGE”,
Overlay: “OVERLAY”,
SoftLight: “SOFT_LIGHT”,
HardLight: “HARD_LIGHT”,
Difference: “DIFFERENCE”,
Exclusion: “EXCLUSION”,
Hue: “HUE”,
Saturation: “SATURATION”,
Color: “COLOR”,
Luminosity: “LUMINOSITY”,
};

// Kode yang mengakses frameNode.fills
if (Array.isArray(frameNode.fills)) {
const fillsArray = ;
for (let i = 0; i < frameNode.fills.length; i++) {
const fill = frameNode.fills[i]; // Variabel ‘fill’ dideklarasikan di dalam loop

// Periksa jika fill.blendMode sudah ada dan sesuai
const blendMode = fill.blendMode && BlendMode[fill.blendMode as keyof BlendModeObject] ? BlendMode[fill.blendMode as keyof BlendModeObject] : "NORMAL";

const fillObject = {
  type: fill.type,
  visible: fill.visible,
  opacity: fill.opacity,
  blendMode: blendMode,
  color: { r: fill.color.r, g: fill.color.g, b: fill.color.b },
};
fillsArray.push(fillObject);

}
frameCode += frame.fills = ${JSON.stringify(fillsArray)};\n;
}