Breakpoints

About this plugin

Preview responsive and adaptive layouts right inside a Figma frame with horizontal and vertical breakpoints for free✅ Works even without the opened plugin window and anyone in your team can resize frame without the installed plugin. For the rest, you can share an animation prototype.How To Get StartedSelect all frames you want to use as breakpoints and click Create From SelectionIf you don’t have frames yet, click Create Blank Layout to start with placeholders► Create Responsive LayoutFEATURES→ Works even when the plugin window is closed→ Save and edit breakpoints later in a Figma layer→ Set custom values with the ruler→ Horizontal and vertical breakpoints→ Quickly switch between breakpoints→ Suitable for Web, Android, iOS, and iPadOS⛔️ There are a couple of restrictions:1. Layouts need opaque backgrounds because they overlap2. Vertical hug contents unavailable, height will be fixed3. Frames will be converted to component mastersDuplicate Example File ↓SUPPORTBack Breakpoints with a $5+ pledge via our secure checkout on Gumroad. Your backing helps us keep improving the product and disables the startup banner.iOS SIZE CLASSESIf you're working on iPhone and iPad designs, the plugin can help you create dynamic layouts for Compact and Regular ranges. There is a magic point 683 for both vertical and horizontal dimensions, which ensures that anything larger is a Regular size, and anything smaller is Compact.Duplicate Size Classes Example File ↓FEEDBACKIf you have a great idea feel free to contact us by email [email protected]. We always welcome creative suggestions from our customers.