색상 토큰 (Color Token)

별칭: color token · 색상 토큰 · 색 토큰 · 포인트 컬러 · 브랜드 컬러

서비스에서 반복해서 쓰는 색 값을 이름 붙여 관리하는 디자인 토큰.

색상 토큰은 primary, background, card, text-muted처럼 색의 역할을 이름으로 정리한다. 수업에서는 SemiClass 톤의 어두운 배경과 파란 포인트 컬러를 정해, AI가 만든 화면들이 같은 분위기를 유지하게 한다.

정의

색상 토큰디자인 토큰 중 색 값을 관리하는 항목이다. #068FFF 같은 실제 색상 값을 primary, background, card, text-muted처럼 역할 이름으로 묶는다.

왜 중요한가

초보자가 AI에게 "예쁘게 만들어줘"라고만 하면 화면마다 다른 색 조합이 나온다. 색상 토큰을 정해 두면 버튼, 링크, 강조 텍스트, 카드 배경이 같은 규칙을 따른다. 서비스의 첫인상도 빨리 안정된다.

Semiclass에서의 의미

디자인 룬 프롬프트에서는 "SemiClass 톤의 어두운 배경과 파란 포인트 컬러"를 기준으로 잡는다. 이 말은 모든 화면을 파랗게 만들라는 뜻이 아니라, 배경·카드·본문·강조색의 역할을 정하고 필요한 곳에만 포인트 컬러를 쓰라는 뜻이다.

주의할 점

색상 토큰은 시각적 취향뿐 아니라 접근성과도 연결된다. 배경과 텍스트의 대비가 낮으면 모바일에서 읽기 어렵다. 초반에는 색을 적게 쓰고, 텍스트·배경·강조색의 대비를 먼저 확인하는 편이 좋다.

출처