색상
시맨틱(색 있는 역할) · 중립(배경·텍스트·테두리) · 커스텀(모듈 도메인 색)으로 나뉜다.
역할 · intent
핵심 동작(주요 버튼·링크·활성). 화면당 하나만 강조.
완료·성공 상태.
주의·경고 상태(되돌릴 수 있는 위험).
삭제·취소 등 파괴적 동작과 오류.
success·warning·danger는 업계 공통 상태 3종. primary는 브랜드 주요 동작.
상태색 글자 · -foreground · -text
상태색 면 위 글자(Button · Badge strong · Toast)는 success-foreground, surface 와 10% 틴트 위 글자(Badge · Alert · FormField 오류 · 증감)는 success-text.
상태색 면 위 글자(Button · Badge strong · Toast)는 warning-foreground, surface 와 10% 틴트 위 글자(Badge · Alert · FormField 오류 · 증감)는 warning-text.
상태색 면 위 글자(Button · Badge strong · Toast)는 danger-foreground, surface 와 10% 틴트 위 글자(Badge · Alert · FormField 오류 · 증감)는 danger-text.
상태색 값은 그대로 두고 글자만 나눴다. 두 토큰은 모든 프리셋 · 위성에서 4.5:1 을 넘는다(npm run conformance 의 대비 검사).
확장 액센트 · 강조·브랜드
포커스 링·인터랙션 강조(teal).
포인트 강조·브랜드(violet).
상태 의도가 아닌 강조용. 의미가 굳어지면(예: AI·연동) 그 이름으로 승격하는 것도 방법. 중립색은 중립색 탭 참고.