문서에디터 사용법
변수와 테마
변수는 디자인에서 반복되는 색상, 크기, 문구를 담습니다. 테마를 쓰면 라이트와 다크처럼 이를 한꺼번에 전환할 수 있습니다.
1변수
Cmd+Shift+V로 변수 패널을 엽니다. 색상, 숫자, 텍스트 변수를 만들고 검색하며, 채우기, 선, 크기, 텍스트에 바인딩합니다. 에이전트는 참/거짓 변수도 만들 수 있습니다.
2테마
테마를 추가해 Mode 같은 축을 만들고, Light와 Dark 같은 변형을 추가합니다. 각 변수는 변형마다 값을 가질 수 있으며, 변형을 바꾸면 그에 바인딩된 모든 것이 다시 그려집니다.
현재 세트를 프리셋으로 저장해 다른 파일에서 다시 쓸 수 있습니다. 프리셋은 .optheme 파일로 내보내고 가져올 수 있습니다.
3디자인 시스템
앱에는 Halo, Lunaris, Nitro, shadcn의 완성된 디자인 시스템 네 가지가 포함되어 있습니다. 각각 라이트와 다크 테마를 갖춘 전체 토큰 세트입니다. 홈의 디자인 시스템에서 적용하거나 에이전트에게 적용을 요청하세요.
4design.md
디자인 시스템 패널(Cmd+Shift+D)에는 디자인을 글로 설명한 내용이 담깁니다: 비주얼 테마, 색상, 타이포그래피, 컴포넌트 스타일, 레이아웃 원칙, 생성 메모. 에이전트는 그리기 전에 이를 읽습니다.
design.md파일로 가져오거나 내보냅니다.- AI 모델로 현재 디자인에서 자동 생성합니다.
- 모두 변수에 동기화는 색상을 변수로 바꾸고, +Var는 하나씩 추가합니다.
5스타일 가이드
에셋 센터에는 에이전트가 따를 수 있는 기본 제공 스타일 가이드 63개와 내 스타일이 있습니다. 스타일에서 DESIGN.md 파일을 가져오거나 내용을 붙여넣으세요. 스타일을 고정하면 에이전트가 모든 새 디자인에 그 스타일을 사용합니다.