Breakpoints are a way to make your design look great on Mobile, Tables or Desktops.

To create Breakpoints, design your website in multiple Artboards where all the Artboard represent the same webpage but for different screen size.

For example, in the following screenshot you can see the same webpage in 3 different screen sizes.

To mark different Artboards as same webpage:

  1. Select one Artboard
  2. Click the Breakpoints button (marked in red below)
  3. Drag yellow line to another Artboard that represents the same web page.