Skip to main content

Make default stroke-position(alignment) compatible with CSS and other web and mobile design defaults (stroke or border outside of the layer path))


Mehmet_Mutlu

Please make the default stroke position outside:

Most of the time designers use strokes to create borders:

Most shapes in Figma got an inside stroke on the layer’s path and if there are lines the stroke is centered.

The default behaviour of web dev and mobile dev (CSS and other libraries) is, default borders are outside.

I am a front-end dev with all sorts of vector design backgrounds and can understand that strokes are centred as the industry standard in Figma or Illustrator or other vector-based apps.

But in CSS the default behaviour of the border is

box-sizing: content-box

in order to achieve the Figma result the developer should implicitly use

box-size: border-box

That’s almost the same in most of the languages, platforms and libraries and leads bugs and complications.

Default stroke behaviour in Figma:

Figma Help Center
This topic has been closed for comments

2 replies

dvaliao
Figmate
  • Community Support
  • 4680 replies
  • May 4, 2023

Thanks for your feedback, @Mehmet_Mutlu!

We’ll pass this along to our team for consideration. Don’t forget to also Vote up top! ☝️ We use votes to prioritize features for future release.


  • 0 replies
  • August 2, 2023

This topic was automatically closed 90 days after the last reply. New replies are no longer allowed.


Cookie policy

We use cookies to enhance and personalize your experience. If you accept you agree to our full cookie policy. Learn more about our cookies.

 
Cookie settings