컬러 피커로 건너뛰기

HSL SwiftUI 변환기

HSL 값을 붙여넣으면 바로 SwiftUI 값이 나옵니다. 다른 형식을 입력해도 됩니다.

인식된 형식: HSL

SwiftUI 값Color(red: 1, green: 0.341, blue: 0.2)
SwiftUI HSL 변환

색 조정

11°
100%

68%
0.210
34°

다른 모든 형식

HSL SwiftUI 변환 예시

색상HSLSwiftUI
hsl(0, 100%, 50%)Color(red: 1, green: 0, blue: 0)
hsl(120, 100%, 50%)Color(red: 0, green: 1, blue: 0)
hsl(240, 100%, 50%)Color(red: 0, green: 0, blue: 1)
hsl(0, 0%, 100%)Color(red: 1, green: 1, blue: 1)
hsl(0, 0%, 0%)Color(red: 0, green: 0, blue: 0)
hsl(0, 0%, 50.2%)Color(red: 0.502, green: 0.502, blue: 0.502)
hsl(10.59, 100%, 60%)Color(red: 1, green: 0.341, blue: 0.2)
hsl(217.22, 91.22%, 59.8%)Color(red: 0.231, green: 0.51, blue: 0.965)
hsl(160.12, 84.08%, 39.41%)Color(red: 0.063, green: 0.725, blue: 0.506)
hsl(37.69, 92.13%, 50.2%)Color(red: 0.961, green: 0.62, blue: 0.043)
hsl(258.31, 89.53%, 66.27%)Color(red: 0.545, green: 0.361, blue: 0.965)
hsl(330.37, 81.19%, 60.39%)Color(red: 0.925, green: 0.282, blue: 0.6)

HSL 및 SwiftUI 형식 정보

HSL은 색조를 각도로, 채도와 명도를 퍼센트로 나타냅니다. 읽기 쉽지만 명도가 지각적으로 균일하지 않아서, 50%의 노랑이 50%의 파랑보다 훨씬 밝아 보입니다.

SwiftUI는 빨강, 초록, 파랑을 0부터 1까지의 값으로 색을 나타내며 Color(red: 1, green: 0.341, blue: 0.2)처럼 씁니다. 불투명도는 opacity 매개변수로 더합니다.

변환 방식

HSL 값을 읽어 CSS Color 4 명세의 행렬로 CIE XYZ로 바꾼 뒤 다시 SwiftUI 값으로 변환합니다. 대상 색역을 벗어난 값은 CSS Color 4 알고리즘으로 매핑하며, 이때 명도와 색조는 유지하고 크로마만 줄입니다.

자주 묻는 질문

HSL 값을 SwiftUI 값으로 어떻게 변환하나요?

위 입력란에 HSL 값을 붙여넣거나 입력하세요. PickShade가 입력하는 즉시 CSS Color 4 공식으로 변환하며, 클릭 한 번으로 SwiftUI 값을 복사할 수 있습니다.

HSL SwiftUI 변환은 정확한가요?

계산은 정확하며, 결과는 화면에 표시할 때만 반올림합니다. 자릿수는 다시 변환해도 같은 색상이 나올 만큼 충분합니다. 색상이 대상 색역에 맞지 않으면 PickShade가 알려 주고 범위 안의 가장 가까운 색상을 보여 줍니다.

다른 형식도 한 번에 얻을 수 있나요?

네. OKLCH, Display P3, Tailwind, SwiftUI, Flutter, Android를 포함한 다른 모든 형식이 결과 아래에 표시되며 클릭 한 번으로 복사됩니다.

이 변환기는 무료인가요?

네. 무료이고 가입이 필요 없으며 모든 처리가 브라우저 안에서 이루어집니다.