Flexbox is a CSS layout model that distributes space along a single axis, making it easy to align and distribute items in a container.

Can I adjust the gap between items?

Yes, use the Gap slider to control spacing between flex items.

How do I copy the CSS?

Click the Copy CSS button to get the flex container CSS code ready to paste.

टूल्स

फ़्लेक्सबॉक्स प्रॉपर्टीज़ विज़ुअलाइज़ करें और CSS कोड कॉपी करें

justify-content: center

align-items: center

flex-direction: row

gap12px

flex-wrap: wrap

आइटम्स6

CSS Output

display: flex;
justify-content: center;
align-items: center;
flex-direction: row;
gap: 12px;