Combining image plus image-mask

Describe the problem/error/question

I am wondering if the Edit Image node could transform a picture into the same of a mask. I’ve been doing it using HTML/CSS, but looking for a way to automate that outside of HTML/CSS. I’ve tried all of the operators and none seem to fit, however perhaps I’m doing something wrong. If Edit Image cannot do it, has anyone accomplished this task before inside of n8n?

What is the error message (if any)? N/A

Please share your workflow

Share the output returned by the last node

Information on your n8n setup

  • n8n version: 1.115.3
  • Database (default: SQLite):
  • n8n EXECUTIONS_PROCESS setting (default: own, main):
  • Running n8n via (Docker, npm, n8n cloud, desktop app): Docker
  • Operating system: Ubuntu 24.04

Hi @Michael.Lutz
Not exactly sure what you mean :grinning_face_with_smiling_eyes:
but playing around with the “In” operator created some interesting art!

Anyway, the code node could be your weapon in such cases.

Maybe you are looking for this template. Found in n8n template library

Modify a bit and I can put my icon on it.

Thanks for the suggestions so far. Some clarification, here’s what I’m trying to accomplish:
CSS Masking - The mask-image Property

I have an image that I want to be in the background, then apply another image (mask) and only have the background come through where the mask image is black.

But I didn’t think about changing the mask color to see if that would work. Still experimenting, so if my clarifications make more sense, post your suggestions - Thanks!

I think this is what the operator “In” do

just give it a try yourself

2 Likes

Thanks! My issue was two-fold. I needed to use a .png for my mask, not an .svg. And the main property name should be the mask, then the composite Image Property the picture, like you did.

With those two things, I got what I needed. Thanks Mohamed and Darrell for your help!

1 Like

This topic was automatically closed 7 days after the last reply. New replies are no longer allowed.