# 색

> 색 라이브러리입니다. 값과 주소가 붙은 이름 있는 시스템 색 열 개, 사용자가 만든 색 견본, 검사기, 색을 만들고 편집하는 일, 시스템 색 덮어쓰기, 그리고 색이 쓰이는 곳.

**Colors**는 Assets 뿌리 아래의 세 번째 범주입니다. 제품이 싣는 고정된 팔레트와 사용자가 더하는 색 견본이며, 저마다 이름 하나에 `#RRGGBB` 값 하나를 가집니다. 패널의 머리는 "색"이고 "색 출력 변수가 돌려주는, 이름이 붙은 #RRGGBB 색입니다. 운전자가 만든 색은 같은 주소의 시스템 색을 덮어씁니다."라는 줄과 개수 필이 함께 놓입니다. 읽는 데에는 **Logic 보기**가, 자기 색을 만들고 편집하고 삭제하는 데에는 **Logic 구성**이 필요합니다.

## 시스템 팔레트 {#the-system-palette}

| 이름 | 주소 | 값 |
| --- | --- | --- |
| Brand | `Assets.Colors.Brand` | `#0369A1` |
| Brand light | `Assets.Colors.Brand_light` | `#38BDF8` |
| Brand tint | `Assets.Colors.Brand_tint` | `#E0F2FE` |
| Red | `Assets.Colors.Red` | `#C42B1C` |
| Amber | `Assets.Colors.Amber` | `#C19C00` |
| Green | `Assets.Colors.Green` | `#0F7B0F` |
| Blue | `Assets.Colors.Blue` | `#005FB8` |
| Gray | `Assets.Colors.Gray` | `#8A8A8A` |
| Black | `Assets.Colors.Black` | `#000000` |
| White | `Assets.Colors.White` | `#FFFFFF` |

색 하나는 값 하나를 가지며 밝은 테마와 어두운 테마에서 그대로 쓰입니다. 팔레트는 테마에 따라 바뀌지 않습니다.

## 카탈로그와 검사기 {#the-catalog-and-the-inspector}

사용자의 색이 먼저 나열되고 그다음에 팔레트가 나옵니다. 거르개는 **출처**와 **쪽마다**입니다. 카드는 색 견본과 이름과 16진수와 출처를 보여 줍니다. 검사기는 색 견본을 16진수와 함께 크게 보여 주고, 이름과 주소와 출처(시스템 팔레트 또는 내 라이브러리)와 형식(`#RRGGBB`)을 보여 줍니다. 팔레트 색은 "시스템 색은 읽기 전용입니다."라고 알립니다. 사용자의 색은 구성할 수 있는 역할에게 **편집**과 **삭제**를 내놓습니다.

## 새 색 {#new-color}

Colors 행 위의 동사는 격자 자리에 "새 색"을 엽니다("변하지 않는 주소 하나와 여섯 자리 RGB 값을 정하십시오.").

| 칸 | 무엇인가 | 값과 기본값 | 효과 |
| --- | --- | --- | --- |
| 이름 | 표시 이름이며 그 마디가 주소입니다. | 필수입니다. | 변수가 담고 있는 주소입니다. 나중에 편집에서 이름을 바꿀 수 있고, 옛 주소를 부르던 모든 참조가 함께 옮겨 갑니다. 마디가 팔레트 색과 같은 이름은 그 주소에서도 목록에서도 그 색을 대신합니다. |
| 선택기 | 브라우저의 색 선택기입니다. | `#0369A1`에서 시작합니다. | 16진수 칸에 값을 씁니다. |
| 16진수 | 값을 글자로 적은 것입니다. | 정확히 `#RRGGBB`이며 기본값은 `#0369A1`입니다. | 그 밖의 것은 "정확히 #RRGGBB 형식으로 쓰십시오."를 보여 줍니다. 값은 대문자로 저장됩니다. |

오른쪽 미리 보기는 색 견본과 정리된 16진수를 보여 줍니다. "이름이 있어야 합니다."와 "정확히 #RRGGBB 형식으로 쓰십시오."는 **색 만들기**를 회색으로 남깁니다. **취소**나 **뒤로**는 만들지 않고 떠납니다. 성공하면 그 카드가 드러나고 작업 기록 줄이 "색을 만들었습니다."라고 말합니다.

## 편집과 삭제 {#edit-and-delete}

**편집**은 "`<name>` 편집"을 엽니다("이름 바꾸기는 Enter를 누르거나 입력란에서 포커스가 떠날 때 저장되며 참조도 함께 옴깁니다. 올바른 색 변경은 자동으로 저장됩니다."). 이름 바꾸기 칸인 **이름** 칸과 그 아래의 선택기와 16진수가 있습니다. 이름을 입력하는 동안 한 줄이 그 영향을 미리 보여 줍니다("이름을 바꾸면 이 주소를 읽는 2곳이 함께 갱신됩니다.", "현재 주소를 사용하는 참조가 없습니다.", 또는 "실제 주소는 바뀌지 않으므로 갱신할 참조가 없습니다."). Enter를 누르거나 칸을 벗어나면 확정됩니다. 색은 자기 id와 값을 그대로 지키고, 옛 주소를 뿌리에서부터 부르던 모든 참조가 고쳐 쓰이며, 작업 기록 줄이 "색 이름을 바꿨고 참조 N곳을 갱신했습니다."라고 말합니다. 이미 쓰이는 이름은 칸 아래에서 그 자리에 거부됩니다. 올바른 값 변경은 마지막 편집 뒤 0.5초 만에 저장됩니다("색을 저장했습니다."). **삭제**는 "'X'을(를) 삭제하시겠습니까? 그 주소에 대한 참조는 풀리지 않은 상태가 됩니다. 이 작업은 되돌릴 수 없습니다."라고 묻고, 그 색이 팔레트 항목을 덮어쓰고 있었다면 그 항목을 다시 드러냅니다.

## 색이 쓰이는 곳 {#where-a-color-is-used}

색 출력 [변수](logic-variables#output-types)가 `Assets.Colors.<name>`을 돌려주고(`Variables.Level.Value > 50 ? Assets.Colors.Red : Assets.Colors.Green`) 거기에 묶인 구성 요소가 그 색을 그립니다. [심볼](assets-symbols)의 채움 색과 선 색 입력은 색 자산이나 색 변수를 받습니다. [대시보드 편집기](view-editor)는 속성이 색을 받는 모든 자리에서 이 주소들을 내놓습니다.

## 이 라이브러리가 하지 않는 일 {#what-the-library-does-not-do}

이 라이브러리는 알파 값이나 세 자리 표기나 이름으로 부르는 색을 받지 않으며, 팔레트를 편집하지 않고, 테마마다의 변형도 두지 않습니다.