Apply a border/stroke to 1 side of a rectangle.
Rectangles: allow 1 or more sides to have a border(stroke), like: border-top
Stuart McCoy commented
The first comment here was made in 2016. It's 2021, this thread had 1643 votes currently (1644 after I add mine), and this isn't even in feature review or any other status. I don't know what's happening at Adobe but they seem to be spending too much time and effort on evangelists, conferences, and live sessions, but not nearly enough time, effort, and money on developers. CSS can literally do this so why can't Adobe XD? I thought this was a tool for web designers?
Please, this feature is really needed.
Try this, if you want the opposite side, just use the negative value
Samuel Castro commented
Hello good afternoon!
Let's take a rectangle as an example:
I think they should enable the option to set the border to a single edge (Not all four sides).
It's such a simple function that I see that both Adobe XD and Figma have been sinning with designers.
In the "RADIUS" option it is possible to configure normally.
No tracing is possible.
I will be looking forward to this update.
A big hug!
How is this not implemented yet?
Yet another year has passed and we still can't create a rectangle with 2 different borders. But hey, at least we have a fancy new plugin API and 3d transforms. Who the hell would be designing text inputs, tabs, popups, dropdowns, tables, lists and panels when they could be writing new plugins and adding sweet 3d transforms to them. Guys, if Tesla took your approach they would have added the wheels 5 years after introducing autopilot.
Anna Polyakov commented
This would be very useful in order to design properly for dev.
This would be a super useful addition
charbel kahwaji commented
guys, you can accomplish this with box-shadow by removing the blur and using either x or y to move the shadow. the shadow unblurred will look like a solid border :)
I have just started using XD. Yesterday I could not resize vector images. Today I can not create borders. How is any actual UIUX professional using this?
Andrew Gillon commented
Such a basic feature please, come on, we need this!!
The fact that such a basic feature is taking so long to implement is ridiculous. To be a useful tool XD should be able to replicate anything HTML and CSS can accomplish.
ali ben moussa commented
2016/03/15 = > 2020/12/22 = 1 743 days (~5 years)
This is a basic functionality for any design tools, basic CSS functionality ......................
Basic functionality for any wysiwyg editor (word, powerpoint, dreamweaver, etc... )
lobbying Adobe XD in my company, but....
Lieva Whitbeck commented
I've been designing UIs since literally just yesterday, and already I've found a simple thing XD can't do... fix it, y'all.
Ettelie Lovern commented
This is very basic CSS functionality that's used a lot. It would be especially useful when sharing for development, because it will match what the developer should actually do. Instead of using a workaround of drawing a line, then trying to align it correctly.
I thought I had made a reusable horizontal navigation menu using content aware and stacks. But I can't include a line for the active state and have it resize correctly based on the length of the text. Content aware doesn't recognize the line, and I can't use a rectangle because I can't apply a border to only one side of it. It's so sad to see amazing features like content aware and stacks not be useful because of something as simple as applying a border to one side of a rectangle, which I've been doing in CSS for years.
It would be also great, to give any rectangle spacing indications. Like 20px on top and 40px on bottom. This way I don't have to waste time to align everything and check 10 times whether I have the right spacings on every page... hope this takes not another 4 more years...
I'm new to XD, but sounds like I'm late to the game on lobbying for this feature.
For what it's worth, the reason I need this feature is I'd like to be able to SIMPLY mockup prototypes and UI interactions involving input elements, however, I'd like to apply a very common design pattern of using underlines for the inputs.
Since I can't create a rectangle with just a bottom border, I can't just create a simple interaction by dragging from my input to the next view. I now have to create a dummy rectangle with no border or fill (which makes it hard to select, position, etc.) and link my interaction to this dummy object. It's a serious pain in the ass.
If there's a workaround to this, I'd love to know.