6 comments

  • Some DesignerSome Designer, over 5 years ago (edited over 5 years ago )

    It actually follows but in a weird way. Visually it does not align to grid or pixel dependant. Only the starting and finishing point is aligned to pixel grid. Rest of the line is "something". Sketch just thickens the baseline with the specified width value. Which causes broken lines when exporting in compressed formats.

    I always use square's with 1 px wide or height to draw lines. It's much more safer and it feels under control.

    3 points
    • Bruno BarrosBruno Barros, over 5 years ago

      Yeah, I've been using 1 pixel wide squares too... but that's a annoying workaround. Lines should work properly.

      1 point
  • John FlynnJohn Flynn, over 5 years ago

    By default, lines have end caps, just like Illustrator. You can change that here:

    Screenshot

    2 points
  • Oliver PattisonOliver Pattison, over 5 years ago (edited over 5 years ago )

    Another thing you may want to know about borders is the center, inside and outside properties. Setting ”inside” will constrain your stroke to a grid, whatever border thickness you choose.

    border example

    Note: If you use this with SVG 1.1 exports, do not expect this feature to work for your SVG output. It is better to use the default “center” value for this reason. If you are producing icons for the web, your design will look nice in Sketch, aligning perfectly to your grid, but your output will behave as if you had used “center”.

    More information on this – this will change in SVG 2 with the stroke-alignment property.

    1 point