spin() 함수
색깔의 색상 (=색조)를 양방향 (즉, + 또는 -)으로 조정. ※ 원래 색조 각도는 0 ~ 360이나, 더 큰 숫자도 가능. ※ 만약, 720 설정 시, 360과 동일 결과 반환. ※ 색상은 RGB 통해 전달되므로, 회색 색조는 유지 X. (∵ 채도가 없으면 색조가 무의미.) ※ 따라서, 색조를 보존하는 방식으로 함수 사용 !!. (예) @c: saturate(spin(#aaaaaa, 10), 10%); // 바람직 X @c: spin(saturate(#aaaaaa, 10%), 10); // 바람직 O [구문] spin(color, angle) [매개변수] color 필수. 기본 색상. angle 필수. 회전시킬 색조 각도. (+ 또는 -) [반환값] 색조 각도가 조정된 color 코드 반환. [예제] spin(hsl(10, 90%, 50%), 30) 반환값: #f2a60d // hsl(40, 90%, 50%) spin(hsl(10, 90%, 50%), -30) 반환값: #f20d59 // hsl(340, 90%, 50%)
색깔의 색상 (=색조)를 양방향 (즉, + 또는 -)으로 조정.
※ 원래 색조 각도는 0 ~ 360이나, 더 큰 숫자도 가능.
※ 만약, 720 설정 시, 360과 동일 결과 반환.
※ 색상은 RGB 통해 전달되므로, 회색 색조는 유지 X.
(∵ 채도가 없으면 색조가 무의미.)
※ 따라서, 색조를 보존하는 방식으로 함수 사용 !!.
(예)
@c: saturate(spin(#aaaaaa, 10), 10%); // 바람직 X
@c: spin(saturate(#aaaaaa, 10%), 10); // 바람직 O
[구문]
spin(color, angle)
[매개변수]
필수. 기본 색상.
angle
필수. 회전시킬 색조 각도. (+ 또는 -)
[반환값]
색조 각도가 조정된 color 코드 반환.
[예제]
spin(hsl(10, 90%, 50%), 30)
반환값: #f2a60d // hsl(40, 90%, 50%)
spin(hsl(10, 90%, 50%), -30)
반환값: #f20d59 // hsl(340, 90%, 50%)
