[FE] ETC: 색 디자인 토큰명 변경

[jnkeniaem]

작업 설명

ex)

  --ref-purple-100: #f9f6ff;
  --ref-purple-200: #dfd0fe;
  --ref-purple-300: #b18cff;
  --ref-purple-350: #a29bfe;
  --ref-purple-400: #a17bf3;
  --ref-purple-500: #9747ff;
  --ref-purple-600: #8337e5;
  --ref-purple-650: #6931b2;
  --ref-purple-690: #3c1c66;
  --ref-purple-700: #252425;

색상들을 명도(밝기) 기준으로 100~900 범위로 매기되, 색상이 10개 이상이라면, 밝기 차이가 적은 색상들은 50단위로 배정

접근 방법

1. 색상 밝기 값 계산
   HSL 값으로 변환하여 밝기(L) 값을 추출

2. 밝기 차이 분석
   인접 색상 간의 밝기 차이를 계산 - 각 색상들의 L 값을 비교하여 차이 구하기

3. 범위 설정 및 숫자 배정
   100~900 인데
   숫자가 10개 이상이면 밝기 차이가 적은건 50 단위로, 50으로는 부족하면 10, 30, 50, 70, 90으로 나눠 지정

대체 방안 (선택 사항)

No response