I would love to be able to use individual values for stroke property, in order to obtain “border-bottom: 1px;”, for example. I could draw a line under to get the same visual effect, but it could confuse the development team.
I could draw a line under to get the same visual effect, but it could confuse the development team.
Hi @Thiago.Nobrega, welcome to the community!
In my experience, there are a lot of things that frontend developers need to adapt and interpret from mockups – what works well in a design does not necessarily work well in code and vice versa. Thus, I think that using a line is the right way to go.
1 Like
It would nice to has this feature Figma already has it
this issue already exists on taiga as “2372 Edit stroke properties”
1 Like
This Taiga issue is exactly what I’m looking for, but it’s almost three years old. It’s the biggest limitation I have with Penpot. Does anyone know if this’ll be addressed at some point?
Thanks!
2 Likes
Any news on this topic? It’s also one of the biggest issues I have with PenPot.
1 Like
+1 i find myself using stroke per side a lot too 
Any update on this? Would be very helpful!
Yes, please! I just signed up to request this.
I could see the UI for this working similarly to the UI for the border-radius, where you could click a button to unlink the one set value and then select individual values for each of the four directions.
It just kind of hurts my CSS-loving brain to not be able to type in border-top and move on with my day. 
2 Likes
+1. just signed up to comment on this feaure.
It should be top priority, Penpot is such anawesome product, I host it locally and love it. But it can’t lack this feature
Penpot looks really promising as an alternative for Figma, but it would be basically impossible to move over without this feature due to the amount of time the workaround takes. There was talk in another thread about a new rendering engine being in development, so i’m guessing this will be fixed along with the new engine. No idea when it’s going to drop though.
totally agree with the sentiments above. To be usable, penpot needs these types of features so it can keep up with modern design trends (ugh I hate the word ‘trends’). background blur, stroke sides, would really help.
2 Likes
Tracked on GitHub now but no timelines: Apply tokens to stroke per side · Issue #9842 · penpot/penpot · GitHub
hi! the first part of this feature is already developed and under a config flag: ✨ Add basic individual strokes implementation by elenatorro · Pull Request #10648 · penpot/penpot · GitHub We’re still working on supporting tokens and fixing bugs. No due date yet, but we’re actively working on it!
6 Likes
Wonderful to hear @elenatorro !
It was my first time discovering and using Penpot today after 5 years of Figma 
I love Figma, but love Open Source more, and Penpot looked like the perfect alternative. I managed to import a massive 1000+ layer file with the Penpot Exporter plugin on Figma, had all variants and layouts correctly imported, decent-ish performance with the WebGL setting, but hit this feature block and had to revert to the old workflow. Would be very glad to see it come to life and ultimately make the switch.
Will be following developments for any updates. Thank you for the amazing project.
(Side note: I can’t really see the video here or on the PR, it shows “Error”, perhaps an access issue?)
I can see the video on Incognito mode, so I don’t think it is an access issue. I’ll describe the video in case you cannot still play it:
A rectangle shape is created and then the Stroke section is opened in the sidebar. There’s a new button there, it is clicked and options to set different stroke thicknesses appear. A variety of values are inserted and you can see how some sides have a thicker border. In addition to this, we can see border radius works as expected.
1 Like
I think this is an issue with the embedded videos not being compatible with some browsers. I get this same problem when using Safari. (I usually end up opening the page in Firefox or Chrome to watch the video!)
1 Like
That’s nice because I was wondering whether anything was planned after an export from Figma for this improvement 
1 Like
