Hey everyone 👋
I’m excited to share the latest update to my open source project.
It’s called Flexbox labs, and it’s a visual tool that helps you create layouts using CSS Flexbox.
It includes:
<ul>
<li>An edit tab - to customize flex container and items.</li>
<li>A save tab - to save custom layouts</li>
<li>A layouts tab - consisting of pre-built layouts</li>
<li>A settings tab - to customize the app</li>
<li>And a clone, undo, redo, reset and generate code feature &amp; many more.</li>
</ul>
It was built using React, TypeScript, Sass and Framer Motion.
Please do give it a star on GitHub ⭐
Site link: <a href="https://flexboxlabs.netlify.app/" target="_blank" rel="noopener nofollow">demo</a>
GitHub repo: <a href="https://github.com/prazzon/Flexbox-Labs" target="_blank" rel="noopener nofollow">repo</a>

Get 1% better daily. Development resource sharing made easy. Post, comment, or upvote to show your contribution and support other developers! 🙌

⚠️ Please do not post any promotional resources.

Dev Squad

Flexbox Labs is an open source visual tool designed to help users create layouts using CSS Flexbox. The tool includes customizable features such as edit, save, pre-built layouts, and settings tabs. Additional functionalities include clone, undo, redo, reset, generate code, and more. Built with React, TypeScript, Sass, and Framer Motion, it aims to simplify layout creation and animations for developers.

I built a Flexbox Playground with Awesome Animations

Can you create nested flexbox items within a flex box?