Foundation
Colors
Primary
--primary
주요 액션, 활성 메뉴, 강조 버튼
Primary FG
--primary-foreground
primary 위 텍스트
Secondary
--secondary
보조 버튼, 칩
Muted
--muted
비활성 영역 배경
Muted FG
--muted-foreground
보조 텍스트
Destructive
--destructive
삭제, 오류
Border
--border
구분선, 테두리
Sidebar
--sidebar
사이드바 배경
Sidebar Primary
--sidebar-primary
사이드바 활성 항목
Sidebar Accent
--sidebar-accent
사이드바 hover
Typography
Radius
0.6rem
--radius-sm
인풋, 작은 배지
0.8rem
--radius-md
버튼
1rem
--radius-lg
카드, 드롭다운
1.4rem
--radius-xl
모달, 시트
Components
Buttons
Variants
Sizes & States
Badges
Variants
Cards
전월 대비 +12%
내과 · 외래 환자
완료율
Form Controls
Input
Controls
Feedback
Progress & Skeleton
Tabs & Tooltip
Overview 탭 콘텐츠
Forms
Input & Textarea
Input
Textarea
Input Group
Addon
Button Group
Grouped Buttons
Select
Select
Native Select
Checkbox & Radio
Checkbox
Radio Group
Slider & Toggle
Slider
Toggle & Toggle Group
OTP & Calendar
Input OTP
Calendar
Switch
Switch
Data Display
Avatar
Sizes & Group
Table
| 환자명 | 진료과 | 구분 | 날짜 | 상태 |
|---|---|---|---|---|
| 김민수 | 내과 | 외래 | 2026-04-23 | 완료 |
| 이지은 | 정형외과 | 입원 | 2026-04-22 | 진행 중 |
| 박준영 | 소아과 | 외래 | 2026-04-22 | 대기 |
| 최수연 | 외과 | 외래 | 2026-04-21 | 완료 |
Item
Default
내과 · 외래
정형외과 · 입원
소아과 · 외래
Muted / Small
내과
정형외과
소아과
Accordion
Single
Breadcrumb & Pagination
Breadcrumb
Pagination
Scroll Area
Vertical Scroll
Empty & Kbd
Empty State
Kbd
Overlay
Alert
Tooltip & Hover Card
Tooltip
Hover Card
Dropdown & Popover
Dropdown Menu
Popover
Dialog & Alert Dialog
Dialog
Alert Dialog
Sheet & Drawer
Sheet (Side Panel)
Drawer (Bottom Sheet)
Command
Command Palette
Horace Components
PageHeader
모든 페이지 상단에 사용하는 공용 헤더. 모바일에서는 워크스페이스 스위처가 함께 표시됩니다.
기본
녹음
액션 버튼 포함
녹음
WorkspaceSwitcher
워크스페이스 전환 컴포넌트. 모바일에서는 Drawer(바텀시트), 데스크탑 사이드바에서는 Popover로 표시됩니다.
Drawer (모바일 — PageHeader 내 pill 트리거)
Popover (데스크탑 — 사이드바 트리거)
RecordingFab
녹음 시작 + 서식 선택을 하나로 합친 플로팅 버튼. 모바일에서는 탭바 위에 고정됩니다.
RecordingItem
녹음 목록에서 사용하는 카드 아이템. 상태 배지, 미분류 표시, 환자 연결 버튼을 포함합니다.