---
sourceDocument: Yokohama Mobile 구성 및 탐색
sourceDocumentLink: https://servicenow-prod.fluidtopics.net/r/ko-KR/yokohama/mobile

 Release :

    - yokohama

ft:locale :

    - ko-KR

ft:publication_title :

    - Yokohama Mobile 구성 및 탐색

ft:clusterId :

    - mobile

bundleId :

    - mobile

workflow :

    - evelopment, Data and Analytics


---

# 테마 변수를 사용하여 색상을 정의하도록 글꼴 아이콘 구성

# 테마 변수를 사용하여 색상을 정의하도록 글꼴 아이콘 구성 {#ariaid-title1}

* 릴리스 버전: Yokohama
* 
* 업데이트 날짜 2025년 01월 30일
* 
* ![](https://www.servicenow.com/docs/portal-asset/ico-clock) 소요 시간: 2분

sys_ux_theme 기록의 CSS 사용자 지정 속성을 지정하여 글꼴 아이콘의 색상을 정의합니다.

## 시작하기 전에

글꼴 아이콘 색상을 정의하는 데 사용할 테마 변수에 대한 sys_ux_theme 기록을 알고 있어야 합니다. 테마 변수에 필요한 값은 sys_ux_theme 속성 테이블의 CSS 사용자 지정 속성입니다.

필요한 역할: admin

## 이 태스크 정보

테마 변수는 글꼴 아이콘에만 적용할 수 있습니다.

화면을 구성하는 워크플로우 내에서 아이콘을 구성하거나 메뉴에서 카드 및 아이콘 범주를 선택하여 아이콘을 구성할 수 있습니다 모바일 앱 작성기 . 이 절차에서는 카드 및 아이콘 범주를 사용합니다.

## 프로시저

1. 다음으로 이동 모두시스템 모바일모바일 앱 작성기.  
   모바일 앱 작성기 새 브라우저 탭에서 열리고 애플리케이션 범위 선택 화면이 표시됩니다.
2. 작업 중인 애플리케이션 범위를 검색한 다음 애플리케이션 범위의 이름을 선택합니다.  
   모바일 앱 작성기 범주 홈 화면이 표시됩니다.
3. 카드 및 아이콘 범주를 선택한 다음, 새로 만들기를 선택합니다.
4. 카드 또는 아이콘 만들기 대화 상자에서 아이콘을 선택한 다음 계속을 선택합니다.
5. 아이콘 양식에서 아이콘의 이름을 입력합니다.  
   아이콘을 쉽게 식별할 수 있는 이름을 선택해야 합니다.
6. 유형 드롭다운 목록에서 글꼴을 선택합니다.
7. 모양 설정 섹션에서 스타일 및 값 필드에 다음 정보를 입력하여 테마 변수를 사용하여 색상을 정의하는 글꼴 아이콘을 구성합니다.  
   행을 추가하려면 더하기 아이콘을 선택합니다.
   {#config-font-icon-to-use-color-theme-var__table_mzt_jgj_vwb__entry__2}

   | 스타일 | 값 |
   |-|-|
   | <kbd class="ph userinput">글꼴 이름</kbd> 입력 | 다음 글꼴 집합 중 하나를 입력합니다. * <kbd class="ph userinput">now-mobile-icons</kbd> 이러한 아이콘은 화면에서 사용하도록 설계되었습니다. 목록 화면과 브라우저 화면으로 이동하는 목록 및 섹션 대상에 사용합니다. 이러한 아이콘을 사용하여 사용자가 탐색할 워크플로우 또는 화면을 나타냅니다. * <kbd class="ph userinput">now-mobile-icons-cards</kbd> 카드 본문에 이 아이콘을 사용합니다. * <kbd class="ph userinput">now-mobile-icons-buttons</kbd> 이러한 아이콘은 기능에 사용하도록 설계되었습니다. 카드에 있는 버튼이나 빠른 작업을 위해 사용할 수 있습니다. * <kbd class="ph userinput">now-mobile-icons-ALPnavbar</kbd> 이러한 아이콘은 모바일 화면의 오른쪽 상단 모서리에 나타나며 다른 화면으로 이동하는 탐색으로 사용됩니다. {#config-font-icon-to-use-color-theme-var__ul_vbq_mgj_vwb} |
   | <kbd class="ph userinput">값</kbd> 입력 | 사용할 글꼴 집합에서 아이콘을 식별하는 코드를 입력합니다. 예를 들어, <kbd class="ph userinput">e903</kbd> 은 글꼴 집합의 now-mobile-icons-buttons 단색 카트 아이콘에 대한 코드입니다. 글꼴 집합 아이콘 코드 목록은 \[참조 주제에 대한 링크 추가\]를 참조하십시오. |
   | <kbd class="ph userinput">FontColorVariable</kbd>를 입력하여 아이콘 색상에 대한 테마 변수를 지정합니다. 이 구성은 선택 사항입니다. 색상을 지정하지 않으면 기본 아이콘 색상은 검은색입니다. 16진수 색상 코드를 사용하려면 16진수 색상 코드를 사용하여 아이콘 색상을 구성하는 방법에 대한 정보가 포함된 \['글꼴 유형 아이콘 구성' 링크\]를 참조하십시오. | 사용할 색상의 테마 변수를 입력합니다. 예를 들어, 다음 CSS 사용자 지정 속성: <kbd class="ph userinput">--now-아코디언 색상</kbd> |
   | <kbd class="ph userinput">이름</kbd> 입력 | 글꼴 집합에서 아이콘에 나열된 이름을 입력합니다. 예를 들어 패밀리에서 now-mobile-icons 쇼핑 카트 아이콘을 사용하려면 <kbd class="ph userinput">카트를</kbd> 입력합니다. 글꼴 집합 아이콘 이름 목록은 문서를 [모바일 아이콘 참조](https://servicenow-prod.fluidtopics.net/tWP_zZ~HlpNzhn330~B3JA "모바일 앱에 이 아이콘을 삽입하는 데 사용합니다 모바일 앱 작성기 .")참조하십시오. |
   [ ]

   {#config-font-icon-to-use-color-theme-var__table_mzt_jgj_vwb}
8. 저장을 선택합니다.