CSS Flexbox Generator

Visually build CSS Flexbox layouts and generate the code instantly.

Controls

Flex Direction

Justify Content

Align Items

Align Content

Flex Wrap

Gap: 10px

Flex Items Count

Item Width

e.g. 100px, auto, 30%

Item Height

e.g. 80px, auto

Container Height: 300px

Live Preview

Generated CSS

Generated HTML

CSS copied to clipboard!

HTML copied to clipboard!

Support & Stay Connected

Follow Updates Bluesky Vote on Product Hunt

Membership Credits

Invite Friends. Earn Kimi Membership Rewards.

Join the Moonshot Together referral program! Invite friends to register or subscribe through your personal referral link or QR code and earn chances to win Kimi Membership Credits. Every successful invitation gives you and your friend an opportunity to receive rewards—from 3-day membership credits up to a 1-year equivalent. Share, invite, and start earning today!

Subscribe Now

10% OFF

10% Off IFTTT Pro Plans!

Power up your workflows with IFTTTs no-code magic, discounted 10% for new subscribers.

Subscribe Now