Launched: Partial CSS border support (independent borders for sides)

Share an idea
81
  • 1, I often resort to using auto layout with padding (eg. Cells would have a white bg, the container would have a grey bg, adjust spacing to mimic the way traditional html tables behave)
82

Please, Please, Please, Pretty Please

I think this feature will save like a million person-hours for humanity. I spend so much time EVERY DAY in hacks trying to do this.
It’s especially a struggle when you have to make complex nested auto layout compositions. I have to add unnecessary extra layers of complexity
It would be so nice to have

1 Like
83

How is this not a standard feature? It’s soooooooo basic.

84

Hey All,

Rest-assured, this is already on our radar! We don’t have a specific timeline to provide just yet, but stay tuned! :wink:

5 Likes
85

what a failure border，what is figma？for what?

for UI designer and coder！！！

you like shadow hacker, but！！！

shadow color can’t follow design system, the color is independent！！！！！！！
it means I must maintain two color systems.

image
image1014×827 45.7 KB

To easier to use borders, something I had to do！！This is not efficiency, it is reversing the design efficiency tool！！

image
image1120×824 30.2 KB

86

There are really two issues being discussed here, both of which are a necessity. Different border values per side is a no-brainer. Implement like border-radius. Why is this not done already?

And there should be a setting or preference per file to use border-box box-sizing or not. That way it would cater to both web designers and mobile designers. Issues with border-box not being calculated correctly create huge headaches with design, dev and QA in a web project, and should be a priority for a web-based design tool to address. Particularly one that prides itself on being the Design System tool. When your design system figma libraries show discrepancies with implemented components, then you have a big problem. It rattles confidence and muddies the source-of-truth waters.

87

Thank you all for your feedback here. We’re excited to bring you Individual Strokes to help you easily apply partial borders to rectangles and frames. Learn more at our Help Center

4 Likes
88

This is amazing.
It’s a shame though that color styles applied to the borders is limited to one. You can’t have on the same object, say, a left border carrying one style and a top border carrying another.
Which brings us to this thread about applying multiple styles to one object.

89

Wow, this just blows my mind! Thanks to all the people voted for this feature, and team from Figma for implementing it :heart:

90

Thanks for this. Been trying to use this functionality today to swap out my divider subcomponents in lists etc. In doing so I came across these suggestions that would make my usage of the functionality:

  • Make it possible to have multiple borders (like effects)
  • Make each “layer” of borders visible/invisible (like background and effects)
  • Make it possible to copy border props from one layer and paste it to another layer.
1 Like
91

agreed… feels like a half baked feature at the moment with only being able to have one colour