1. 화면 구조 / 레이아웃
Card UI & Grid
Card UI
현재 이 박스 자체가 Card UI이며, 이들이 배치된 형태가 Grid입니다.
Carousel / Slider
Banner 1
Banner 2
Accordion
접고 펼칠 수 있는 아코디언 UI입니다.
Tabs
내용이 여기에 표시됩니다.
2. 버튼 / 이동 / 행동 유도
CTA & Buttons
Sticky Header & Floating Button Simulation Area
Sticky Header Sim
3. 팝업 / 안내 / 보조 UI
설명창 (Tooltip)
Skeleton Loading
4. 콘텐츠 탐색 방식
Infinite Scroll
Post 1
Post 2
Post 3
Loading more...
Pagination
페이지 번호를 눌러 이동하는 방식입니다.
5. 인터랙션 / 상태 변화
Hover State
Active State
Micro Interaction
Parallax Effect Area
6. 비주얼 스타일
Glassmorphism
반투명하고 흐릿한 느낌의 유리 디자인 스타일입니다.
Neumorphism
7. 반응형 / 접근성
Responsive & Breakpoint
현재 화면 크기에 따라 레이아웃이 변경됩니다. (Responsive Design)
Current Breakpoints: sm(640), md(768), lg(1024)
ARIA & Accessibility
스크린 리더 사용자를 위한 접근성 속성입니다.
<button aria-label="닫기"> </button>