더 많은 기능 소개 레이아웃 (10)
전체 보기- 01Pro
비대칭 기능 카드
짧은 카드 두 개가 유일하게 행동 유도 요소를 가진 긴 카드 하나 옆에 쌓이며, 제목과 아이콘 배지가 그 위에 있습니다. React와 Tailwind로 기능 세 가지의 순위를 매기세요.
- 02Pro
벤토 서비스 기능 그리드
여백 없이 가장자리까지 이어지는 벤토 패널에서는 구분선 자체가 레이아웃이며, 각 패널마다 고유한 표면 색상, 문구, 버튼이 있습니다. React와 Tailwind로 서비스를 설명하세요.
- 03Pro
테두리 서비스 기능 행
카드도 채우기도 없이, 원형 아이콘 타일이 hover 시 셀이 따뜻해지며 평평해지는 세 개의 구분된 셀입니다. React와 Tailwind — 페이지 하단에 어울릴 만큼 차분합니다.
- 04Pro
센터 통계 기능 카드
전체 너비 색상 띠 위의 가운데 패널 하나에 아이콘 배지, 문구, 통계 카드 세 개, 버튼이 담깁니다. React와 Tailwind — 흐름의 쉼표로 사용하세요.
- 05Pro
코드 프리뷰 기능 분할
터미널로 증명합니다: 재생되는 배포 로그와 오프셋 블록 위의 업타임 타일 두 개 옆에 구분선으로 나뉜 기능 세 가지가 있습니다. React와 Tailwind — 실제 출력을 붙여 넣으세요.
- 06Pro
아이콘 카드 기능 트리오
옅게 물든 띠 위의 동등한 카드들, 각각 원형 아이콘 타일과 모서리에 잘려 들어간 회전된 정사각형이 있습니다. React와 Tailwind — 표면 쌍마다 색을 바꾸세요.
- 08Pro
모바일 앱 기능 목록
결과로 서술된 혜택 행 세 개와 오프셋 그림자가 있는 헤드라인, 행동 유도 요소 두 개 옆에 폰 목업이 있습니다. React와 Tailwind — 새 목업을 내보내세요.
- 09Pro
폰 목업 기능 그리드
가운데 폰 목업 양옆에 카드 네 개가 있고, 각각 자체 전체 너비 버튼으로 끝나며 장식은 대각선으로 배치됩니다. React와 Tailwind — 개수는 짝수로 유지하세요.
- 10Pro
스택 카드 기능
전체 화면 색상 띠 위 아이콘 행이 주장을 펼치고, 겹쳐진 증거 카드 콜라주가 그에 답합니다. React와 Tailwind — 히어로 아래에 배치하세요.
- 11Pro
태그된 기능 카드 그리드
각각 하나의 링크인 카드 여섯 개가 카테고리로 태그되고, hover 시 화살표가 미끄러지는 푸터 바로 마무리됩니다. React와 Tailwind — 여섯 개나 열두 개로 작성하세요.
https://neobrutalism.com/ko/blocks/feature-blocks/metrics-band-feature-section
