Support all the same attributes as CSS box-shadow (add spread & inner shadow)
Be able to apply the same CSS box-shadow attributes on UI elements in Xd.
Shadow on Xd works fine but still limited compared with CSS box-shadow capabilities. It's frustrating to be limited to 3 values only (x, y and B) when you know you can deliver better shadows in development.
The attributes should be similar to make the transition from design to development (or sometimes from development to design) easy. For example, in Photoshop it is tricky because the units are different (like spread as % in PS and px in CSS) and you can't get negative values for these attributes in PS.
I know you can export your design to CSS in PS, which is great for a general tool. But for Xd, I believe you shouldn't need to "convert" things for web because they are in the same context. A UI developer should be able to use your design in Xd as reference just looking for the UI's attributes.
Thanks in advance.
I think this is a rather important feature as this is the way we think about shadows when applying them in CSS.
The spread and the inner shadow are mainly the only things keeping me and my company from going full in wit Adobe XD for when creating design systems.
Please don't forget about the negative spread too!!
Jerry Wang commented
The spread attribute is necessary. Without it your big shadow will looks very ugly. You can't create something like in https://facebook.design
The ability to add multiple shadows to one element is also necessary
Armando Scuro commented
if you guys are working on css export, please fix the shadow settings and add spread and inner shadow first.
because no developer wants a messy code that they have to fix and rewrite
I was shocked that the spread settings are still not in the XD.
The lack of this feature is keeping me from switching from Sketch to XD.
I am currently working on a project where I need the elements on the page to look like they glow like neon lights. When I apply a shadow to the elements in XD, because of the lack of the spread feature, I am not able to provide this effect. Sketch has this feature, and XD needs to incorporate it as well.
Is there anything missing aside from spread (both positive & negative) and inner shadow?
If not, maybe we can turn this into a request focused specifically on spread. We already have separate requests for these other shadow features:
* Inner shadow: https://adobexd.uservoice.com/forums/353007/suggestions/15631440-inner-shadow
* Multiple shadows (and fills/strokes): https://adobexd.uservoice.com/forums/353007/suggestions/12956715-multiple-fills-borders-and-shadows
james guest commented
ok - what's happening with this request. I see tags on others about them being filed or worked on. This is a fundamental feature for an interface design program. please give us an update.
james guest commented
has this feature request been added yet? What's the latest?
I agree. Working with shadows (aka wanting to make them look good) is still a pain in the butt in illustrator or sketch.
You always need 2 layers (one with the object and one with the shadow) to make the shadows look good. This makes it a drag to resize and copy or edit these objects.
don't make us do workarounds to achieve a modern shadow effect like this: https://m.youtube.com/watch?v=IbtFSbUkw7k
negative spread supported in css, plus for other platforms can export as png. adobe reflow had this option and it worked great.
Leonardo Hauschild commented
@corey Seems to me that having XD work for many platforms doesn't invalidate the "CSS box-shadows are needed" argument though.
To replicate material design's shadows in ps/ai/sketch i only seem to get things right when using multiple shadows on one object with multiple "spreads".
One can thus propose that the css standard can work well also for other platforms, don't'ya think?
AdminCorey Lucier (Adobe) (Admin, Adobe) commented
Hi Fabio! We will be evolving things here soon (inner shadow, more shadow attributes, etc). But also keep in mind that XD is a tool for designing for many platforms, e.g. web but also native desktop and device UI.