[SOCAR FRAME 만들기 #2] 다크 모드 받고 디자인 시스템 더블로 가! (2탄)

쏘카 프로덕트 디자인팀에서 다크 모드 구현을 위한 컬러 시스템 구축 과정을 공유하는 글입니다. 기존의 명도와 기능에 따른 컬러 정의 방식에서 벗어나, 명도/기능 기반의 '베이직 컬러'와 UI 요소에 직접 적용되는 '시멘틱 컬러'로 컬러 시스템을 재정의했습니다.

특히 라이트 모드와 다크 모드 간 1:1 대응을 고려하여 컬러 시스템을 구축했으며, 이는 디자인 시스템의 일관성과 확장성을 높이는 데 기여합니다. 글에서는 베이직 컬러와 시멘틱 컬러의 구조 변경 및 구축 과정을 상세히 설명하며, 디자인 시스템 구축에 대한 실질적인 인사이트를 제공합니다.