검색 구성 요소

카테고리

모든 구성 요소

사용 가능한 모든 Tailwind CSS 구성 요소 찾아보기

콘텐츠 링크로 건너뛰기

대시보드용으로 설계된 웹 응용 프로그램의 접근성을 위한 콘텐츠 링크로 최소한의 건너뛰기.

로더 구성 요소

포트폴리오에 적합한 트라이어딕 색 구성표가 있는 반응형 Material Design 로더 구성 요소로, 어두운 테마 지원과 여러 대화형 요소를 특징으로 합니다.

검색 상자 구성 요소

비즈니스/기업 웹사이트를 위한 반응형 검색 상자 구성 요소로, 마이크로 인터랙션과 유사한 색 구성표를 특징으로 합니다. 여기에는 검색 입력, 버튼, 사용자 아바타와 텍스트가 있는 동적 결과 드롭다운이 포함되어 다크 모드를 지원합니다.

스큐어모픽 대시보드 툴팁

대시보드를 위한 복잡한 스큐어모픽 툴팁 구성 요소로, 트라이어드 색 구성표와 다크 모드를 지원하는 반응형 디자인을 특징으로 하며, JavaScript 없이 Tailwind CSS로 빌드되었습니다.

스큐어모픽 이미지 라이트박스

포트폴리오를 위한 스큐어모픽 그레이스케일 디자인의 반응형 이미지 라이트박스 구성 요소로, 다크 모드를 지원합니다.

소셜미디어포스트모달

단순하고 반응이 빠른 Material Design에서 영감을 받은 모달 구성 요소로, 소셜 미디어 응용 프로그램에 적합한 유사한 색 구성표를 사용합니다. 어두운 테마를 지원합니다.

메가 메뉴 컴포넌트

Tailwind CSS를 사용하여 다크 모드 UI, 유사한 색 구성표 및 대시보드 목적을 위한 복잡한 복잡성이 있는 메가 메뉴 구성 요소. 반응형이어야 하며 Tailwind dark: 접두사를 사용하여 어두운 테마를 지원해야 합니다. JavaScript 코드가 필요하지 않으며 Tailwind 클래스가 있는 HTML만 있습니다. 이미지는 picsum.photos에서, 아바타는 randomuser.me 에서 가져옵니다.

데이터 테이블 구성 요소

Neumorphism 디자인, 트라이어딕 색 구성표 및 다크 모드 지원을 갖춘 반응형 데이터 테이블 구성 요소로, 블로그 또는 콘텐츠 사이트에 적합합니다.

가격 표시 구성 요소

보색 구성표(연한 주황색 및 연한 파란색)를 갖춘 Neumorphism 스타일의 가격 표시 구성 요소로, 전자 상거래를 위한 중간 정도의 복잡성을 제공합니다. 어두운 테마를 지원하는 반응형 디자인이 특징입니다. 구성 요소는 제품 이미지, 제목 및 가격을 '장바구니에 추가' 버튼과 함께 표시합니다. 다크 모드는 채도가 낮은 보색을 사용합니다.

Carousel Slider 구성 요소

다크 모드를 지원하는 반응형 캐러셀 슬라이더 구성 요소입니다. 이 구성 요소는 JavaScript 없이 HTML 및 Tailwind CSS만 사용합니다. 활성 슬라이드를 위한 생생한 색상의 간단한 레이아웃이 특징이며 블로그 또는 콘텐츠 소비에 적합합니다.