작업 경로 / 입력에서 결과까지
색상 음영 단계를 생성하는 방법
- 01
기본 색상 설정하기
「기본 색상」에 16진수 값을 입력하세요. #RGB, #RGBA, #RRGGBB, #RRGGBBAA 모두 사용할 수 있고, 필드는 #6D5EF8로 열려요. 기본 색상은 완성된 스케일의 한가울데에 놓여요.
- 02
셰이드 개수 선택하기
「셰이드 개수」를 3~20의 정수로 설정하세요. 기본값은 9입니다. 홀수로 하면 기본 색상을 중심으로 어두운 쪽과 밝은 쪽이 균등하게 배치됩니다. 짝수여도 기본 색상은 중앙에 유지되고 밝은 쪽에 스와치가 하나 더 생겨요.
- 03
램프 생성하기
「셰이드 생성」을 누르세요. 팔레트는 깊은 셰이드에서 기본 색상을 지나 밝은 틴트까지 이어지고, 각 스와치에는 번호와 16진수 값이 표시되어 위치 1이 항상 가장 어두운 단계입니다.
- 04
블렌드 동작 확인하기
기본 색 아래의 셰이드는 검정 쪽으로, 위의 틴트는 흰색 쪽으로 혼합되지만, 블렌드가 어느 극단으로도 78% 이상 나아가지는 않습니다. 양끝 단계가 거의 검정이나 거의 흰색으로 무너지지 않고 채도 있는 사용 가능한 색으로 남아요.
- 05
샘플 스케일 불러오기
「샘플 불러오기」를 누륩면 #0EA5E9를 중심으로 일곱 개의 셰이드가 생성됩니다. 직접 브랜드 색상을 입력하기 전에 살펴볼 수 있는 완전한 참고 실행입니다. 「초기화」는 기본 색상 #6D5EF8과 개수 9로 되돌려요.
- 06
토큰 복사 또는 다운로드하기
「출력 복사」를 눌러 --toolars-shade-1 … 커스텀 프로퍼티로 이뤄진 :root 블록을 복사하거나, 「다운로드」를 눌러 toolars-color-shades.css로 저장하세요. 그대로 스타일시트에 붙여 넣을 수 있습니다. 각 스와치 카드에도 16진수 값이 표시되어 한 색만 따로 복사할 수 있습니다.