Flexbox 플레이그라운드

실시간 미리보기가 포함된 CSS Flexbox 레이아웃 테스터입니다.

flex-direction

justify-content

align-items

flex-wrap

gap:8px

미리보기

생성된 CSS

.container {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: stretch;
  flex-wrap: nowrap;
  gap: 8px;
}

Flexbox 플레이그라운드: CSS Flexbox 속성을 시각적으로 실험해보세요. flex-direction, justify-content, align-items, flex-wrap, gap 등을 조정하여 레이아웃 변화를 실시간으로 확인할 수 있습니다. 아이템을 추가하거나 제거하여 다양한 구성을 테스트하세요.