{"id":14960790,"url":"https://github.com/haruma-k/upalette","last_synced_at":"2025-05-16T11:05:39.169Z","repository":{"id":38399651,"uuid":"367639025","full_name":"Haruma-K/uPalette","owner":"Haruma-K","description":"Centralized management \u0026 batch change system of colors for Unity.","archived":false,"fork":false,"pushed_at":"2025-04-10T06:04:47.000Z","size":2541,"stargazers_count":346,"open_issues_count":1,"forks_count":31,"subscribers_count":7,"default_branch":"master","last_synced_at":"2025-05-16T11:05:30.983Z","etag":null,"topics":["color","palette","swatch","unity","unity-editor"],"latest_commit_sha":null,"homepage":"","language":"C#","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/Haruma-K.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE.md","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2021-05-15T13:29:41.000Z","updated_at":"2025-05-09T09:23:29.000Z","dependencies_parsed_at":"2024-01-14T15:22:55.239Z","dependency_job_id":"7d98d662-f30e-46ea-b65a-ad783ccf7657","html_url":"https://github.com/Haruma-K/uPalette","commit_stats":{"total_commits":106,"total_committers":4,"mean_commits":26.5,"dds":"0.24528301886792447","last_synced_commit":"3973bf852c0087909794d65d8a02cba8ee3a49a6"},"previous_names":[],"tags_count":23,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Haruma-K%2FuPalette","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Haruma-K%2FuPalette/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Haruma-K%2FuPalette/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Haruma-K%2FuPalette/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/Haruma-K","download_url":"https://codeload.github.com/Haruma-K/uPalette/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":254518384,"owners_count":22084374,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["color","palette","swatch","unity","unity-editor"],"created_at":"2024-09-24T13:23:01.069Z","updated_at":"2025-05-16T11:05:34.160Z","avatar_url":"https://github.com/Haruma-K.png","language":"C#","funding_links":[],"categories":[],"sub_categories":[],"readme":"\u003ch1 align=\"center\"\u003euPalette\u003c/h1\u003e\n\n[![license](https://img.shields.io/badge/license-MIT-green.svg)](LICENSE.md)\n[![license](https://img.shields.io/badge/PR-welcome-green.svg)](https://github.com/pulls)\n[![license](https://img.shields.io/badge/Unity-2020.1-green.svg)](#Requirements)\n\n**Docs** ([English](README.md), [日本語](README_JA.md))\n| [Demo](Assets/Demo/Demo.unity)\n\nCentrally manage colors and text styles in Unity projects.\n\n\u003cp align=\"center\"\u003e\n  \u003cimg width=\"90%\" src=\"https://user-images.githubusercontent.com/47441314/159275911-0445d1da-690b-4b56-86e8-85d57d79f257.gif\" alt=\"Demo\"\u003e\n\u003c/p\u003e\n\n## Table of Contents\n\n\u003c!-- START doctoc generated TOC please keep comment here to allow auto update --\u003e\n\u003c!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE --\u003e\n\u003cdetails\u003e\n\u003csummary\u003eDetails\u003c/summary\u003e\n\n- [Concept \u0026 Features](#concept--features)\n- [Setup](#setup)\n  - [Requirements](#requirements)\n  - [Installation](#installation)\n- [Getting Started](#getting-started)\n  - [Create Palette Store](#create-palette-store)\n  - [Create Entry](#create-entry)\n  - [Apply Entry](#apply-entry)\n  - [Highlight synchronized GameObjects](#highlight-synchronized-gameobjects)\n  - [Handling non-color Entries.](#handling-non-color-entries)\n  - [Organizing Entries into Folders](#organizing-entries-into-folders)\n- [Theme Feature Usage](#theme-feature-usage)\n  - [What is Theme?](#what-is-theme)\n  - [Create Theme](#create-theme)\n  - [Switch Themes (Editor)](#switch-themes-editor)\n  - [Switch Themes (Script)](#switch-themes-script)\n- [Advanced Usage](#advanced-usage)\n  - [SynchronizeEvent - Only notify changes in entry values](#synchronizeevent---only-notify-changes-in-entry-values)\n  - [Automatic generation of enums for Entries and Themes](#automatic-generation-of-enums-for-entries-and-themes)\n    - [Get / Monitor entry value from script](#get--monitor-entry-value-from-script)\n  - [Don't manage Palette Data with PreloadedAssets](#dont-manage-palette-data-with-preloadedassets)\n  - [Edit uPalette data from scripts](#edit-upalette-data-from-scripts)\n  - [Reflects values to your own components](#reflects-values-to-your-own-components)\n  - [Configure behavior when an entry is not found](#configure-behavior-when-an-entry-is-not-found)\n- [Implemented Synchronizers](#implemented-synchronizers)\n- [Technical details](#technical-details)\n  - [About the timing of reflecting Entries](#about-the-timing-of-reflecting-entries)\n- [How to update from version 1](#how-to-update-from-version-1)\n- [Demo](#demo)\n- [Licenses](#licenses)\n\n\u003c/details\u003e\n\u003c!-- END doctoc generated TOC please keep comment here to allow auto update --\u003e\n\n## Concept \u0026 Features\nIn typical application development, one color is applied to multiple locations. The same blue color is applied to the button background, icon color, and outline in the following example.\n\n\u003cp align=\"center\"\u003e\n  \u003cimg width=\"50%\" src=\"https://user-images.githubusercontent.com/47441314/159170066-1bd16348-b013-4f47-8d64-988f43f2fde7.png\" alt=\"Apply blue color\"\u003e\n\u003c/p\u003e\n\nNow think about changing this color from blue to green. In Unity, color values are serialized in Prefabs and Scenes, so we need to change all these values one by one.\n\n\u003cp align=\"center\"\u003e\n  \u003cimg width=\"50%\" src=\"https://user-images.githubusercontent.com/47441314/158061951-ff91aaee-019a-4ea4-9c74-012a93f0558f.png\" alt=\"Change the color to green\"\u003e\n\u003c/p\u003e\n\nThis workload increases with the size of the project. With uPalette, such changes can be applied in batches by centralizing color management.\n\n\u003cp align=\"center\"\u003e\n  \u003cimg width=\"50%\" src=\"https://user-images.githubusercontent.com/47441314/158061961-153d13ba-a4ee-45ee-b513-9d7956f21fa4.png\" alt=\"uPalette\"\u003e\n\u003c/p\u003e\n\nuPalette also allows you to manage text styles and gradients as well as colors.\n\n\u003cp align=\"center\"\u003e\n  \u003cimg width=\"70%\" src=\"https://user-images.githubusercontent.com/47441314/158065275-5b9e5801-88e8-4667-8cbe-67bc428d4b1e.png\" alt=\"Character Styles \u0026 Gradients\"\u003e\n\u003c/p\u003e\n\nIn addition, the theme feature allows you to save a set of colors and text styles as a theme. By switching the active theme, you can reflect the colors and text style according to that theme.\n\n\u003cp align=\"center\"\u003e\n  \u003cimg width=\"70%\" src=\"https://user-images.githubusercontent.com/47441314/158065218-21a3f422-ad00-4da9-ab61-455408c2f7d1.gif\" alt=\"Theme Feature\"\u003e\n\u003c/p\u003e\n\n## Setup\n\n### Requirements\nUnity2020.1 or higher.\n\n### Installation\nインストールは以下の手順で行います。\n\n1. Select `Window \u003e Package Manager` in Unity Editor.\n2. Select `“+” Button \u003e Add package from git URL` .\n3. Enter the following URL.\n    - https://github.com/Haruma-K/uPalette.git?path=/Assets/uPalette\n\n\u003cp align=\"center\"\u003e\n  \u003cimg width=\"50%\" src=\"https://user-images.githubusercontent.com/47441314/118421190-97842b00-b6fb-11eb-9f94-4dc94e82367a.png\" alt=\"Install\"\u003e\n\u003c/p\u003e\n\nIf you want to install a specific version, add the version to the end of the URL as follows.\n\n- https://github.com/Haruma-K/uPalette.git?path=/Assets/uPalette#2.0.0\n\nYou can also update the version in the same manner as installation.\n\nNote that if you get a message like `No 'git' executable was found. Please install Git on your system and restart Unity`, you need to set up Git on your machine.\n\n## Getting Started\n\n### Create Palette Store\nTo use uPalette, first open the Palette Editor from `Window \u003e uPalette \u003e Palette Editor`. You will see a window like as follows when you open the Palette Editor.\n\n\u003cp align=\"center\"\u003e\n  \u003cimg width=\"70%\" src=\"https://user-images.githubusercontent.com/47441314/157675097-e260f475-5ba0-42af-adfc-06d8155103d8.png\" alt=\"Palette Editor\"\u003e\n\u003c/p\u003e\n\nNext, create a Palette Store asset by clicking the center `Create Palette Store` button. Palette Store is the asset that will hold the data for the uPalette. You can place this anywhere in the project, but not in the Editor folder or Streaming Assets folder because this asset is used at runtime.\n\nAfter creating a Palette Store asset, the Palette Editor will change to the following display.\n\n\u003cp align=\"center\"\u003e\n  \u003cimg width=\"70%\" src=\"https://user-images.githubusercontent.com/47441314/157675124-bf3471c4-5f0f-4a07-ae10-8a97b3d986ad.png\" alt=\"Palette Editor\"\u003e\n\u003c/p\u003e\n\n### Create Entry\nIn uPalette, color and character style settings are called Entries. You can add an Entry by pressing the “+” button in the upper right corner of the Palette Editor.\n\n\u003cp align=\"center\"\u003e\n  \u003cimg width=\"70%\" src=\"https://user-images.githubusercontent.com/47441314/157674758-981455be-7770-4a54-af49-71f69dd01276.gif\" alt=\"Add Entry\"\u003e\n\u003c/p\u003e\n\nYou can rename an Entry by clicking on its name. Entries can also be deleted by right-clicking menu of them.\n\n\u003cp align=\"center\"\u003e\n  \u003cimg width=\"70%\" src=\"https://user-images.githubusercontent.com/47441314/157676311-1b7d12fc-a410-4303-a38a-fbe2f3192265.gif\" alt=\"Rename \u0026 Remove Entry\"\u003e\n\u003c/p\u003e\n\nYou can also drag elements to reorder them.\n\n### Apply Entry\nTo apply the color and character style you created to components, select the target GameObject and press the Apply button for the target entry. The names of applicable components and properties will then be listed, and you can select the one you want to apply.\n\n\u003cp align=\"center\"\u003e\n  \u003cimg width=\"70%\" src=\"https://user-images.githubusercontent.com/47441314/157679154-0e1aa71a-27f4-49c4-9c28-9eca8080f96d.gif\" alt=\"Apply Entry\"\u003e\n\u003c/p\u003e\n\nThis will synchronize the entries and properties. When the value of a synchronized Entry changed, the property is automatically rewritten.\n\n\u003cp align=\"center\"\u003e\n  \u003cimg width=\"70%\" src=\"https://user-images.githubusercontent.com/47441314/157680482-2df5fe4c-3756-4422-89fb-208a89b1f657.gif\" alt=\"Change Entry Value\"\u003e\n\u003c/p\u003e\n\nAt this time, a component named Synchronizer is attached to the target GameObject. You can change the target Entry from this Inspector. If you want to remove synchronization with the Entry, detach this component.\n\n\u003cp align=\"center\"\u003e\n  \u003cimg width=\"70%\" src=\"https://user-images.githubusercontent.com/47441314/162608969-56152f04-00f1-4b86-8d07-08537bd15c34.png\" alt=\"Synchroizer\"\u003e\n\u003c/p\u003e\n\nNote that When the Entry is applied to Prefab, It is not serialized in Prefab as in the normal Prefab workflow. You can serialize by right-clicking menu of Prefab.\n\n\u003cp align=\"center\"\u003e\n  \u003cimg width=\"70%\" src=\"https://user-images.githubusercontent.com/47441314/162609447-23ed99fb-2173-4717-84b6-79951ed70d88.gif\" alt=\"Serialization\"\u003e\n\u003c/p\u003e\n\n### Highlight synchronized GameObjects\nSelect Highlight from the Entry’s right-clicking menu to highlight (select) the synchronized GameObjects.\n\n\u003cp align=\"center\"\u003e\n  \u003cimg width=\"70%\" src=\"https://user-images.githubusercontent.com/47441314/157684607-0b28a34a-c892-4458-9b0d-a3cdf8ea10e5.gif\" alt=\"Highlight\"\u003e\n\u003c/p\u003e\n\n### Handling non-color Entries.\nUp to this point, I have described how to manage colors in uPalette. In addition to colors, there are other palette types in uPalette, such as gradients and character styles. You can switch between Palette types from the drop-down menu in the upper left corner of the Palette Editor.\n\n\u003cp align=\"center\"\u003e\n  \u003cimg width=\"70%\" src=\"https://user-images.githubusercontent.com/47441314/157685702-e2d83f7c-4cfa-4b37-9561-0067f5c828c0.gif\" alt=\"Various Palettes\"\u003e\n\u003c/p\u003e\n\nEach drop-down menu is described below.\n\n| Name | Description |\n| --- | --- |\n| Color | Use to manage color. |\n| Gradient | Use to manage gradient. |\n| Character Style | Use to manage character style of uGUI Text. |\n| Character Style TMP | Use to manage character style of Text Mesh Pro. |\n\n### Organizing Entries into Folders\nYou can organize entries into folders by separating entry names with slashes.\nWhen entries are organized into folders, they are displayed hierarchically in the Palette Editor as shown in the figure below.\n\n\u003cp align=\"center\"\u003e\n  \u003cimg width=\"70%\" src=\"Documentation/folder_mode.png\" alt=\"Folder Mode\"\u003e\n\u003c/p\u003e\nThe setting to organize entries into folders can be changed from the following menu.\n\n* Project Settings \u003e uPalette \u003e Use Folder View in Palette Editor\n\nIf you choose not to organize entries into folders, all elements will be displayed flatly and can be rearranged via drag and drop.\nIf you choose to organize entries into folders, they will be sorted in alphabetical order.\n\n## Theme Feature Usage\n\n### What is Theme?\nThe Theme feature allows you to save a set of the Entries as “theme”. You can save multiple Themes, and switch between them to reflect the colors and character styles of each Theme.\n\n\u003cp align=\"center\"\u003e\n  \u003cimg width=\"70%\" src=\"https://user-images.githubusercontent.com/47441314/157786384-dc33d7a0-eec3-4413-9639-2b61b8c9f1b5.gif\" alt=\"Theme\"\u003e\n\u003c/p\u003e\n\n### Create Theme\nTo create a Theme, open the Theme Editor from `Window \u003e uPalette \u003e Theme Editor`. By default, there is a Theme named Default, and you can create a new Theme from the upper left “+” button. You can rename, delete, reorder, etc. using the same operations as in the Entry Editor.\n\n\u003cp align=\"center\"\u003e\n  \u003cimg width=\"70%\" src=\"https://user-images.githubusercontent.com/47441314/157786982-b19be4af-ffd4-407e-a8dc-3ba39c9426f4.gif\" alt=\"Theme Editor\"\u003e\n\u003c/p\u003e\n\nWhen a Theme is added, a column is added to the Palette Editor for setting Entries for that theme. By editing this column, you can set values according to the Theme.\n\n\u003cp align=\"center\"\u003e\n  \u003cimg width=\"70%\" src=\"https://user-images.githubusercontent.com/47441314/159245296-ad887c65-27f9-4274-a641-811833683130.png\" alt=\"Palette Editor\"\u003e\n\u003c/p\u003e\n\nYou can set the Theme for each Palette type. The palette type can be changed from the drop-down menu in the upper left corner of the Theme Editor.\n\n\u003cp align=\"center\"\u003e\n  \u003cimg width=\"50%\" src=\"https://user-images.githubusercontent.com/47441314/157789707-b2103a3a-cf9b-4e55-a7ac-157604608cb9.gif\" alt=\"Change Palette Type\"\u003e\n\u003c/p\u003e\n\n### Switch Themes (Editor)\nYou can switch Themes by pressing the Activate button from the Theme Editor.  When you switch themes, the values of the Entry in that Theme are immediately reflected.\n\n\u003cp align=\"center\"\u003e\n  \u003cimg width=\"70%\" src=\"https://user-images.githubusercontent.com/47441314/157788787-e1cf2500-7b20-4a60-86cf-421613089517.gif\" alt=\"Change Theme\"\u003e\n\u003c/p\u003e\n\n### Switch Themes (Script)\nTo switch Themes at runtime, use `SetActiveTheme()` in the `Palette` class. Below is an example script that switches the ColorPalette theme using [automatically generated theme enum](Automatic-generation-of-enums-for-Entries-and-Themes).\n\n```csharp\nusing System;\nusing UnityEngine;\nusing uPalette.Generated;\nusing uPalette.Runtime.Core;\n\npublic class Example : MonoBehaviour\n{\n    public void OnGUI()\n    {\n        foreach (ColorTheme colorTheme in Enum.GetValues(typeof(ColorTheme)))\n            if (GUILayout.Button(colorTheme.ToString()))\n            {\n                var colorPalette = PaletteStore.Instance.ColorPalette;\n                colorPalette.SetActiveTheme(colorTheme.ToThemeId());\n            }\n    }\n}\n```\n\nAttach this to GameObject and play to switch Themes as follows.\n\n\u003cp align=\"center\"\u003e\n  \u003cimg width=\"70%\" src=\"https://user-images.githubusercontent.com/47441314/158050236-389b9798-e9e9-46fe-bb15-c862d263bff4.gif\" alt=\"Change Theme\"\u003e\n\u003c/p\u003e\n\n## Advanced Usage\n\n### SynchronizeEvent - Only notify changes in entry values\nAs mentioned above, the Synchronizer component applies the value to the target property when the Entry value is changed. In contrast, you can receive only value change notifications as event by using the following Synchronize Event components.\n\n* Color Synchronize Event\n* Gradient Synchronize Event\n* Character Style Synchronize Event\n* Character Style TMP Synchronize Event\n\nTo use it, attach the above component and setup UnityEvent to handle when the value changes.\n\n\u003cp align=\"center\"\u003e\n  \u003cimg width=\"70%\" src=\"https://user-images.githubusercontent.com/47441314/162609856-a64ab4de-9f44-4c92-9762-cd262f3ceeb9.png\" alt=\"Change Theme\"\u003e\n\u003c/p\u003e\n\n### Automatic generation of enums for Entries and Themes\nWhen working with uPalette from script, it is useful to have a script automatically generated to access Theme and Entry information.\n\nIf you set `Project Settings \u003e uPalette \u003e Name Enums File Generation`to`When Window Loses Focus`, this file will be automatically generated when the focus is lost from the Palette Editor or Theme Editor. If you set a folder to `Name Enums File Location`, the file will be generated in that folder. If not set, the file will be generated in the Assets folder.\n\n\u003cp align=\"center\"\u003e\n  \u003cimg width=\"70%\" src=\"https://user-images.githubusercontent.com/47441314/158021815-2cec00b7-46f1-403b-b459-e03c8754b29d.png\" alt=\"Project Settings\"\u003e\n\u003c/p\u003e\n\nThe following enum is generated.\n\n```csharp\nusing System;\n\nnamespace uPalette.Generated\n{\n    public enum ColorEntry\n    {\n        Red,\n        Green,\n        Blue,\n    }\n}\n```\n\n`ToEntryId()`, defined as extension method of this enum, can be used to get the Entry ID.\n\n```csharp\nusing uPalette.Generated;\n\npublic class Example\n{\n    private void Foo()\n    {\n        ColorEntry.Red.ToEntryId();\n    }\n}\n```\n\nThe same can be used for other types of Entries and Themes.\n\nIf you check the `Contains Folder Name to Name Enums` option in the project settings, the folder name will also be included in the Enums.\nIf you uncheck this option, the name used for the Enums will exclude the folder name.\n\n#### Get / Monitor entry value from script\nIf you want to get or monitor the entry value from script, you can use the `GetActiveValue()` method of each palette.\n`IReadOnlyObservableProperty\u003cT\u003e` will be returned, so use its `Value` property to get the current value.\nAnd you can also use the `Subscribe()` to monitor changes in value if you want to watch for changes like theme changes.\n\n```csharp\nusing System;\nusing UnityEngine;\nusing uPalette.Generated;\nusing uPalette.Runtime.Core;\n\npublic class Example : MonoBehaviour\n{\n    private void Start()\n    {\n        // Get the color palette.\n        var colorPalette = PaletteStore.Instance.ColorPalette;\n\n        // Get the color entry id from the auto-generated ColorEntry enum.\n        var targetColorEntryId = ColorEntry.KeyColor1.ToEntryId();\n\n        var colorProperty = colorPalette.GetActiveValue(targetColorEntryId);\n\n        // If you want to get the current value, use the Value property.\n        var targetValue = colorProperty.Value;\n\n        // If you want to get the value when the theme is changed, subscribe the property.\n        IObserver\u003cColor\u003e observer;\n        var disposable = colorProperty.Subscribe(observer);\n    }\n}\n```\n\n### Don't manage Palette Data with PreloadedAssets\nIn default, Palette Data is registered to **PreloadedAssets**, and it is loaded automatically in runtime.\nThis means that the Palette Data is included in the application.\n\nIf you don't want to register Palette Data to **PreloadedAssets**, for example, when you want to make it to the **AssetBundle**, do the following.\n\n* Uncheck **Project Settings \u003e uPalette \u003e Automatic Runtime Data Loading**.\n\n\u003cp align=\"center\"\u003e\n  \u003cimg width=\"70%\" src=\"https://user-images.githubusercontent.com/47441314/196029215-31b06774-fbb1-4951-836c-c7928bfbaea0.png\" alt=\"Automatic Runtime Data Loading\"\u003e\n\u003c/p\u003e\n\nIf you do this, the Palette Data is removed from **PreloadedAssets**.\nSo you need to load the **PaletteStore** manually.\nThe loaded **PaletteStore** is automatically registered to `PaletteStore.Instance` and you can access it from there.\nNote that you need to load it before loading GUIs that use uPalette.\n\n```cs\n// You must load the PaletteStore manually before loading GUIs that use uPalette.\nvar _ = Resources.Load\u003cPaletteStore\u003e(\"PaletteStore\");\n```\n\nIn editor, the *PaletteStore* is always loaded via `AssetDatabase`.\n\n### Edit uPalette data from scripts\nYou can edit uPalette data from scripts by retrieving a palette from the PaletteStore as shown below. Note that you must always set the dirty flag after editing the PaletteStore, because it is a ScriptableObject.\n\n```csharp\n// Get PaletteStore.\nvar paletteStore = PaletteStore.Instance;\n\n// Get each palette.\nvar colorPalette = PaletteStore.Instance.ColorPalette;\nvar gradientPalette = PaletteStore.Instance.GradientPalette;\nvar characterStylePalette = PaletteStore.Instance.CharacterStylePalette;\nvar characterStyleTMPPalette = PaletteStore.Instance.CharacterStyleTMPPalette;\n\n// Set the dirty flag after editing.\nEditorUtility.SetDirty(paletteStore);\n\n// Save assets if you need.\nAssetDatabase.SaveAssets();\n```\n\n### Reflects values to your own components\nuPalette includes [Synchronizers to reflect values to standard component](#Implemented-Synchronizers).\n\nYou can also create a Synchronizer to reflect values in your own components. As an example, consider a custom component with Gradient as a property.\n\n```csharp\nusing UnityEngine;\n\npublic class SampleGradient : MonoBehaviour\n{\n    [SerializeField] private Gradient _gradient;\n\n    public Gradient Gradient\n    {\n        get =\u003e _gradient;\n        set =\u003e _gradient = value;\n    }\n}\n```\n\nA Synchronizer to reflect the value to this property can be created as follows.\n\n```csharp\nusing UnityEngine;\nusing uPalette.Runtime.Core.Synchronizer.Gradient;\n\n[AddComponentMenu(\"\")]\n[DisallowMultipleComponent]\n[RequireComponent(typeof(SampleGradient))]\n[GradientSynchronizer(typeof(SampleGradient), \"Gradient\")]\npublic sealed class GraphicColorSynchronizer : GradientSynchronizer\u003cSampleGradient\u003e\n{\n    protected override Gradient GetValue()\n    {\n        return _component.Gradient;\n    }\n\n    protected override void SetValue(Gradient value)\n    {\n        _component.Gradient = value;\n    }\n}\n```\n\n### Configure behavior when an entry is not found\n\nWhen a target Entry is not found, you may want to output error logs, or you may want to ignore it. You can configure the behavior when an Entry is not found by `Project Settings \u003e uPalette \u003e Missing Entry Error`.\n\n\u003cp align=\"center\"\u003e\n  \u003cimg width=\"70%\" src=\"https://user-images.githubusercontent.com/47441314/158050990-59e1fae4-d8ec-4ae8-8d15-4009016aee29.png\" alt=\"Missing Entry Error\"\u003e\n\u003c/p\u003e\n\nThe selections are as follows.\n\n| Name | Description |\n| --- | --- |\n| None | Do nothing. |\n| Warning | Output warning logs. |\n| Error | Output error logs. |\n| Exception | Throw exceptions. |\n\n## Implemented Synchronizers\nThe Synchronizer implemented in uPalette is as follows.\n\n| Entry Type | Target Class Name | Target Property Name |\n| --- | --- | --- |\n| Color | UnityEngine.UI.Graphic | color |\n| Color | UnityEngine.UI.Outline | effectColor |\n| Color | UnityEngine.UI.Selectable | colors.normalColor |\n| Color | UnityEngine.UI.Selectable | colors.selectedColor |\n| Color | UnityEngine.UI.Selectable | colors.pressedColor |\n| Color | UnityEngine.UI.Selectable | colors.disabledColor |\n| Color | UnityEngine.UI.Selectable | colors.highlightedColor |\n| Color | UnityEngine.UI.InputField | caretColor |\n| Color | UnityEngine.UI.InputField | selectionColor |\n| Color | TMPro.TMP_InputField | caretColor |\n| Color | TMPro.TMP_InputField | selectionColor |\n| CharacterStyle | UnityEngine.UI.Text | font / fontStyle / fontSize / lineSpacing |\n| CharacterStyleTMP | TMPro.TextMeshProUGUI | font / fontStyle / fontSize / enableAutoSizing / characterSpacing / wordSpacing / lineSpacing / paragraphSpacing |\n\n## Technical details\n\n### About the timing of reflecting Entries\n\nIn Unity, information such as colors and character styles set for each component are serialized as values as they are. Therefore, these serialized values should be rewritten when they are changed.\n\nHowever, this would result in changes to many Scenes and Prefabs when an Entry is changed. So uPalette reflects the Entry according to the following rules.\n\n- Entries are serialized as IDs, not values.\n- In Edit Mode, this Entry is reflected and observed for changes when `OnEnable` is called.\n- In Play Mode, Entries are reflected when `Start()` is called.\n\nIn addition, to prevent changes when a Scene is opened in Edit Mode, the dirty flags is not set when an Entry are reflected.\n\n## How to update from version 1\n\nIn upgrading uPalette from version 1 to version 2, I have made significant changes to the data structure and data placement.\n\nIf you have been using version 1, you can transfer your data to version 2 by pressing the following button from Project Settings before creating Palette Store.\n\n\u003cp align=\"center\"\u003e\n  \u003cimg width=\"70%\" src=\"https://user-images.githubusercontent.com/47441314/158051937-fe364df4-7105-4de0-83d4-a15e6c7a3517.png\" alt=\"How to update\"\u003e\n\u003c/p\u003e\n\nAfter you click on the button, the panel to save the Palette Store will appear. You can place the Palette Store anywhere in the project, but not in the Editor folder or Streaming Assets folder because this asset is used at runtime.\n\n## Demo\n1. Clone this repository.\n2. Open and play the following scene.\n    - [https://github.com/Haruma-K/uPalette/blob/master/Assets/Demo/Demo.unity](https://github.com/Haruma-K/uPalette/blob/master/Assets/Demo/Demo.unity)\n\n## Licenses\nThis software is released under the MIT license. You are free to use it within the scope of the license, but the following copyright and license notices are required.\n\n- [LICENSE.md](LICENSE.md)\n\nIn addition, the table of contents for this document has been created using the following software\n\n- [toc-generator](https://github.com/technote-space/toc-generator)\n\nSee [Third Party Notices.md](Third%20Party%20Notices.md) for more information about the license of toc-generator.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fharuma-k%2Fupalette","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fharuma-k%2Fupalette","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fharuma-k%2Fupalette/lists"}