reopt designreopt design
DocsExploreToolsPricingBuilder
시작하기
개요
시작하기
Next.js 설치
Private install
핵심 개념
아키텍처
컴포지션 패턴
접근성
키보드 패턴
스타일링
테마 시스템
고급 패턴
구축·운영
Skills
AI 연동
CLI (opt surface add)
의존 그래프
도구
Canvas 카탈로그
Theme Builder
Form Builder
템플릿
템플릿
릴리즈
릴리즈 노트
Oopt-ui
reopt designreopt design

AI 시대를 위한 디자인 시스템

  • 문서
  • 가격
  • 릴리즈 노트
  • GitHub
  • 서비스 약관
  • 개인정보처리방침

© 2026 reopt-ai. All rights reserved.

템플릿
  1. 문서
  2. /
  3. 템플릿
  4. /
  5. 템플릿

Templates

shell

opt-ui 컴포넌트를 활용한 완성된 인터페이스 템플릿. 실제 프로젝트의 시작점으로 활용하세요.

템플릿 활용

템플릿은 opt-ui 컴포넌트를 조합한 완성된 페이지 예제입니다. 코드를 복사하여 프로젝트에 적용하거나, 구조를 참고하여 커스텀 레이아웃을 만들 수 있습니다.

  • 모든 템플릿은 키보드만으로 완전히 조작 가능
  • 다크 모드 기본 지원
  • 반응형 레이아웃

템플릿 목록

Admin Panel

사용 가능

사이드바 네비게이션, 대시보드 통계, 사용자 테이블, 설정 폼, 커맨드 팔레트, 토스트 알림을 포함한 관리자 패널. CommandPalette로 빠른 명령 실행, Toast로 작업 피드백 제공.

DashboardGridContentTabsCommandPaletteToast

새 창에서 보기

Analytics Dashboard

사용 가능

실시간 이벤트, 성과 지표, 트래픽 분석, 매출 데이터를 시각화한 분석 대시보드. Progress로 목표 달성률, DataTable로 페이지별 통계 표시.

DashboardGridDataTableProgressStatusSelect

새 창에서 보기

Settings Page

사용 가능

일반, 알림, 보안, 도움말 탭으로 구성된 종합 설정 페이지. Disclosure로 접이식 카테고리, FaqAccordion으로 도움말 섹션 구현.

ContentTabsSettingsFormDisclosureFaqAccordion

새 창에서 보기

Kanban Board

준비 중

드래그 앤 드롭 칸반 보드. 키보드만으로 카드 이동과 편집이 가능한 접근성 우선 설계.

CompositeZoneDialogMenu

곧 제공 예정

Documentation

준비 중

사이드바 네비게이션과 마크다운 렌더링을 포함한 문서 페이지. 검색 기능과 목차 자동 생성.

SidebarNavContentTabsSearchCombobox

곧 제공 예정

Email Inbox

준비 중

이메일 목록과 상세 보기를 포함한 메일함 인터페이스. 키보드로 빠른 탐색 가능.

CompositeZoneDataTableDialog

곧 제공 예정

키보드 내비게이션

키동작
↑ ↓템플릿 카드 간 이동
Enter사용 가능한 템플릿을 새 창에서 열기
Tab다음 섹션으로 이동
Previous의존 그래프컴포넌트 간 사용 관계를 레이어별 그래프로 탐색하고 상향 의존을 점검구축·운영
의존 그래프 페이지로 이동
Next릴리즈 노트opt-ui, opt-cli, opt-ui-surface 계열의 버전별 변경 사항과 하이라이트릴리즈