디자인 파일의 색상 프로파일 관리
다양한 디스플레이가 다양한 기술을 사용하여 색상을 렌더링하므로 다양한 기기, 모니터, 브라우저, 애플리케이션 간에 시각적 불일치가 발생할 수 있습니다. 팀이 성장함에 따라 불일치도 커질 수 있습니다.
Figma의 색상 관리를 사용하면 다음을 수행할 수 있습니다.
- 팀원들이 서로 다른 디스플레이를 사용하더라도 색상 일관성 유지
- 새로 생성된 모든 디자인 파일에 대해 기본 색상 프로파일 선택
- 파일의 색상을 한 색상 프로파일에서 다른 색상 프로파일로 변경
- 특정 색상 프로파일로 자산 내보내기
지원되는 색상 프로파일
Figma design에서는 두 색상 프로파일, 즉 sRGB 및 Display P3 중에서 선택할 수 있습니다.
sRGB는 가장 널리 사용되는 색상 프로파일로, 오랫동안 웹의 표준이었으며 거의 모든 웹 브라우저와 디스플레이에서 지원됩니다.
Display P3(P3라고도 함)는 색상이 더 선명하며 시각적으로 sRGB보다 49% 더 뚜렷한 색상을 나타냅니다. 아직은 웹과 디스플레이의 표준이 아니지만, 인기가 많아지고 있습니다. iOS 기기 또는 Retina 화면용으로 빌드하는 경우 Display P3가 적합합니다.
참고: 위 이미지는 HSB(색조, 채도, 명도) 공간에서 sRGB 및 Display P3의 색상 범위를 나타냅니다. 색상 모델에 대해 자세히 알아보기 →
채도는 반경에 표시되며 중앙으로 갈수록 채도가 낮아지고 바깥쪽 가장자리로 갈수록 채도가 높아집니다. sRGB 원 밖의 영역은 P3가 sRGB보다 훨씬 더 높은 채도를 나타낼 수 있음을 의미합니다.
명도는 100%로만 제시되었지만, 두 색상 프로파일의 명도는 모두 전체 범위입니다.
최상의 결과를 위해서는 디스플레이가 선택한 색상 프로파일을 지원하는지 그리고 해당 프로파일로 설정되어 있는지 확인해야 합니다. 예를 들어 Display P3 색상은 이 프로파일을 지원하지 않는 모니터에 제대로 표시되지 않습니다.
FigJam 보드는 sRGB로 렌더링됩니다.
기본 색상 프로파일 선택
새로운 디자인 파일은 기본적으로 sRGB로 설정됩니다. 생성한 디자인 파일에 대해 다른 색상 프로파일을 선택하려면 다음 단계를 따르세요.
- 액세스 권한이 있는 파일을 엽니다.
- Figma 메뉴를 엽니다.
- 기본 설정 > 색상 프로파일로 이동합니다.
- 색상 프로파일 설정 모달에서 sRGB 또는 Display p3를 선택합니다.
- 를 클릭하여 모달을 닫고 설정을 저장합니다.
파일의 색상 프로파일 변경
색상 프로파일을 파일 수준에서 변경할 수 있습니다. 파일의 색상 프로파일을 변경할 때는 다음과 같은 두 가지 선택 사항이 있습니다.
- 색상 값 유지(할당): 색상의 표시 형식을 변경하되, 해당 값은 변경하지 않습니다.
- 표시 형식 유지(변환): 색상의 값을 변경하되, 해당 표시 형식은 변경하지 않습니다.
참고: 분기 및 병합을 통해 색상 프로파일을 변경할 수는 없습니다. 예를 들어 Display P3의 파일을 분기에서 sRGB로 변환하는 경우 변경 사항을 병합하면 색상 값이 변경되지만, 색상 프로파일은 변경되지 않습니다.
색상 값 유지(할당)
파일에 색상 프로파일을 할당하면 색상이 시각적으로 변경되지만, 헥스 코드 또는 HSB 값과 같은 해당 기본 데이터는 동일하게 유지됩니다.
브랜드 색상과 같은 특정 색상으로 작업할 때 색상 값을 유지하도록 선택할 수 있습니다. 이 경우 색상이 약간 다르게 나타나더라도 브랜드 헥스 코드가 기기 및 파일 전체에서 일관되게 유지되는 것이 더 중요합니다.
파일에 색상 프로파일을 할당하려면 다음 단계를 따르세요.
- 파일을 연 상태에서 파일 이름 옆의 아이콘을 클릭합니다.
- 파일 색상 프로파일 > Display P3로 변경 또는 sRGB로 변경으로 이동합니다.
- 모달에서 색상 값 유지(할당)를 선택합니다.
- 변경 사항을 저장하려면 Display P3 할당 또는 Assign sRGB 할당을 클릭합니다.
표시 형식 유지(변환)
파일을 다른 색상 프로파일로 변환하면 색상의 기본 데이터가 변경되지만, 동일하거나 최대한 비슷하게 보입니다.
브레인스토밍, 와이어프레임 제작 또는 다양한 기기에서 색상이 어떻게 나타나는지 테스트하는 데 중점을 두고 있다면 색상의 표시 형식을 유지하도록 선택할 수 있습니다. 이러한 경우에는 시스템을 유지하는 것보다 일관된 표시 형식이 더 중요합니다.
변환하기 전에 다음 사항에 유의합니다.
- 파일을 이전에 사용한 색상 프로파일로 변환해도 색상이 이전의 원래 값으로 되돌아가지 않을 수 있습니다.
- sRGB는 색상 범위가 더 작기 때문에 파일을 Display P3에서 sRGB로 변환하면 가장 가까운 근사 색상을 찾아서 일부 색상이 “잘릴” 수 있습니다.
파일을 다른 색상 프로파일로 변환하려면 다음 단계를 따르세요.
- 파일을 연 상태에서 파일 이름 옆의 아이콘을 클릭합니다.
- 파일 색상 프로파일 > Display P3로 변경 또는 sRGB로 변경으로 이동합니다.
- 모달에서 표시 형식 유지(변환)를 선택합니다.
- 변경 사항을 저장하려면 Display P3로 변환 또는 sRGB로 변환을 클릭합니다.
색상 스타일 및 색상 변수는 변환의 영향을 받지 않으므로 해당 색상 값은 변경되지 않습니다.
색상 프로파일 변경 실행 취소
파일에 대한 색상 프로파일 변경을 실행 취소하려면 다음 중 하나를 선택합니다.
- 키보드 단축키 ⌘ Command / Control Z 사용
- 버전 내역에서 이전 버전 선택
참고: 버전 내역은 색상 프로파일 변경 활동과 변경된 프로파일을 로깅하지만, 할당 또는 변환 여부는 로깅하지 않습니다. 버전 정보를 편집하여 이 세부 정보를 추가할 수 있습니다.
레거시 파일에 색상 프로파일 할당
관리되지 않음 설정은 2023년 8월부터 더 이상 사용할 수 없습니다. 관리되지 않음으로 설정된 이전 디자인 파일에는 색상 프로파일이 지정되지 않으며, 이 디자인 파일은 기본 프로파일(기본 색상 프로파일)과 동일하게 설정됩니다. 기본 색상 프로파일 세트가 없다면 이 레거시 파일은 sRGB로 렌더링됩니다.
레거시 파일에 색상 프로파일을 할당하려면 다음 단계를 따르세요.
- 파일을 연 상태에서 파일 이름 옆의 아이콘을 클릭합니다.
- 파일 색상 프로파일 > sRGB에 할당 또는 Display P3에 할당으로 이동합니다.
색상 프로파일을 할당하고 나면 파일을 다른 색상 프로파일로 변환할 수 있는 액세스 권한을 얻게 되지만, 기본 프로파일과 동일 설정으로 되돌릴 수는 없습니다.
자산 내보내기
기본적으로 Figma는 파일의 색상 프로파일을 사용하여 자산을 내보냅니다. 그러나 내보낼 때 다른 색상 프로파일을 선택할 수 있습니다. 색상 프로파일의 자산을 내보내는 방법 알아보기 →