Disable Effects in the Export Menu

Share an idea
1

Currently, an image with an effect, like a drop shadow, is exported with that effect. If a developer wants the image without the shadow, to add with CSS separately, they must disable it in the design, export, then turn it back on. This is cumbersome and prone to error. Instead, there should be another checkbox in the export menu allowing this to be done there, without altering the design.

mockup

2 Likes
2

You can simply wrap the image in a frame and apply the effects to the frame only. The developer will be able to select the image and export it without effects.

4 Likes
3

You can simply wrap the image in a frame and apply the effects to the frame only. The developer will be able to select the image and export it without effects.

It is a good workaround, but not ‘simple’. Requires coordinating the feedback to designer and ensuring the practice is followed.

2 Likes
4

If the design includes an Image with a gradient or solid color overlay on it/rounded corners/drop shadows, the Export of the image includes everything as a whole and doesn’t include an option to separate the “style layers” for the export. It is an annoyance for both designers and developers as the designers have to go back and duplicate the image without the styling applied to it and the developers are confused about the styling applied to it.

A solution can include having a selection for which items the developer wants to export. e.g. only exporting the image and not any of the edits applied to it

5

Yeah this is very annoying. Now I have to make sure the 50% black overlays for a slider must be done as a new layer inside a frame, so you have image layer, black overlay layer and then a frame grouping them both. This is the only way for the developer to have the image without the design overlay. This additional layers is just a bunch of unnecessary work - such a mission to setup this layered structure on top of what Figma already has built-in, when a developer could technically just temporarily hide layer effects for an export.

In addition, there is currently no way to get access to the original image inside a frame. you literally have to make seperate floating frames for the developer off the artboard area, so they have a different element to export from the one used on the design.