Flex Layout Tutorial | Design & Code with Penpot's unique layout feature
YouTube Viewers YouTube Viewers
8.62K subscribers
1,820 views
0

 Published On Jun 13, 2023

Flex Layout is one of Penpot’s most requested features and a total turning point in responsive design.
In this video, Ester Latorre and Eva Marco explain with a real case the application of Flex Layout for both design and coding using Penpot. Explore more about Flex Layout! https://penpot.dev/layout

For designers, it allows a more efficient way to lay out, align, and distribute space among items in the container.
For developers, it enables them to easily get specifications to build flexible layouts that automatically adapt to different screen sizes and devices.



--
Penpot is the first open-source design and prototyping tool for Product teams.

Penpot allows a true collaboration between designers and developers thanks to features like Flex Layout and Code Inspect. It’s the only one that can be web based or self-hosted. The tool works with open web standards (SVG) avoiding vendor lock-in and giving teams absolute freedom in their designs.

You can use it for your mockups, webs, apps and any other type of UX & UI Design

- Penpot Community -
https://community.penpot.app

Design: https://penpot.app​​
Help: https://help.penpot.app​
Contribute: https://github.com/penpot

Follow us:
* Twitter:   / penpotapp   ​​
* Instagram:   / penpot.app  
* Github: https://github.com/penpot
* Mastodon: https://fosstodon.org/@penpot/​
* LinkedIn:   / penpotdesign  

Penpot: Bring Design Freedom For Product Teams.

Intro 0:00
Design the layout board: 1:45
Wrap: 4:38
Space management: 5:34
Absolute position: 10:28
Code time! 12:13
Seamless translation of Design into Code: 16:23
Download and try our Flex Layout template: 16:39

show more

Share/Embed