Clipping Masks

artblane · 2026-07-29T05:44:51.584+00:00

Hello, This is a beginner question, I'm wondering if there is any documentation on using clipping masks in nordcraft? Does this have to be manually written in the CSS panel using clip-path, or is there a way to do it visually? Thank you!

artblane
15 days ago
Hello,
This is a beginner question, I'm wondering if there is any documentation on using clipping masks in nordcraft? Does this have to be manually written in the CSS panel using clip-path, or is there a way to do it visually?
Thank you!
artblane
15 days ago
here is an example of the clipping mask animation I am trying to achieve from figma
I imagine the best way to set this up would be to use the hover psuedo class, and add a translate animation, but I'm not sure exactly how to achieve the mask effect
Jacob Kofoed
15 days ago
Paths and shapes are generally not supported visually in Nordcraft (yet), but you can always just write the CSS yourself using the CSS raw editor or advanced-properties in the bottom of the style-panel. Once a visual editor is added your properties should show correctly. Let me know if you need an example of this.
artblane
15 days ago
An example would be so helpful I really appreciate the clarification too :). I dug around the nordcraft templates for an example but got a bit lost.
Jacob Kofoed
13 days ago
Not sure if this is exactly what you're after, but I put this together quickly using clip-path and other maskings https://editor.nordcraft.com/projects/pinktaunwelightbedbug/branches/start/components/HomePage?ai-thread=e55a2451-252a-4740-b33d-7f09e3aedade&rightpanel=events&mode=design

See examples live here https://start-pinktaunwelightbedbug.nordcraft.site/
artblane
13 days ago
This is fantastic. Thank you for your support!!
Tod
13 days ago
Great job @artblane! Your contribution to the Nordcraft Community just made you advance to Community Level 1! 🌲

Clipping Masks

artblane

artblane

Jacob Kofoed

artblane

Jacob Kofoed

artblane

Tod