I recently switched to using Variables in my design system and now applying new variables to components is a tedious process, especially when it comes to specifying the border (stroke) widths using variables. The variables icon appears only if one selects a custom set of strokes for an element and only after applying the same variable to each stroke position (top, left, right, bottom) the main stroke width input magically supports variables.
Solved
(Bug) Applying variables to stroke sizes
Best answer by Junko3
Hi @Mateusz_Przytula, Thank you for pointing that out! I completely understand how helpful it would be to be able to apply a variable to all sides of a stroke simultaneously.
Could you please try right-clicking on that field and selecting “apply variable…”?
I initially had the same thoughts as you when I saw your post, but then I found this: Variables for stroke width? Feel free to check out the last two comments of this post 😉
I hope this helps. Please let us if there’s anything I’ve misunderstood.
Thanks,
1 person likes this
Hi @Mateusz_Przytula, Thank you for pointing that out! I completely understand how helpful it would be to be able to apply a variable to all sides of a stroke simultaneously.
Could you please try right-clicking on that field and selecting “apply variable…”?
I initially had the same thoughts as you when I saw your post, but then I found this: Variables for stroke width? Feel free to check out the last two comments of this post 😉
I hope this helps. Please let us if there’s anything I’ve misunderstood.
Thanks,
Tricky! Didn’t notice that, thanks for sharing. It solved the issue for me but I would like to see it as a minor update to Figma’s UI to increase the width of the stroke width input to accommodate for new variable icon. Thanks again! 😍
That happened to me too! Thanks for the hack to apply the variable for now.
Thankssss helped a lot 🥰
I think the UX can be improved by putting the icon on the hover variable like other inputs on the page.
1 person likes this
Thanks for the feedback! It’s definitely easy to understand. We’ll share it internally.
Reply
Rich Text Editor, editor1
Editor toolbars
Press ALT 0 for help
Enter your E-mail address. We'll send you an e-mail with instructions to reset your password.