# Eye Dropper Color Picker `Schema Alias: Umbraco.ColorPicker.EyeDropper` `UI Alias: Umb.PropertyEditorUi.EyeDropper` `Returns: string` The Eye Dropper Color picker allows you to choose a color from the full color spectrum using HEX and RGBA. ## Data Type Definition Example ![Eye Dropper Color Picker Data Type Definition](https://2050077833-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fb0WSXUuM7Qx5BfREagAI%2Fuploads%2Fgit-blob-0f1fb36893afa0a783cba65468e1d92bbe2830fc%2FEye-Dropper-Color-Picker-DataType.png?alt=media) ## Content Example ![Eye Dropper Color Picker Content](https://2050077833-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fb0WSXUuM7Qx5BfREagAI%2Fuploads%2Fgit-blob-d8ce4de3f88e90c037928e28fdd5c3c104523835%2FEye-Dropper-Color-Picker-Content.png?alt=media) ## Example with Models Builder ```csharp @{ var color = Model.Color?.ToString(); if (color != null) { } } ``` ## Example without Models Builder ```csharp @{ var color = Model.Value("Color"); if (color != null) { } } ``` ## Add values programmatically See the example below to see how a value can be added or changed programmatically. To update a value of a property editor you need the [Content Service](https://apidocs.umbraco.com/v17/csharp/api/Umbraco.Cms.Core.Services.ContentService.html). {% hint style="info" %} The example below demonstrates how to add values programmatically using a Razor view. However, this is used for illustrative purposes only and is not the recommended method for production environments. {% endhint %} ```csharp @using Umbraco.Cms.Core.Services @inject IContentService ContentService @{ // Create a variable for the GUID of the page you want to update var guid = Guid.Parse("32e60db4-1283-4caa-9645-f2153f9888ef"); // Get the page using the GUID you've defined var content = ContentService.GetById(guid); // ID of your page // Set the value of the property with alias 'color'. content.SetValue("color", "#6fa8dc"); // Save the change ContentService.Save(content); } ``` Although the use of a GUID is preferable, you can also use the numeric ID to get the page: ```csharp @{ // Get the page using it's id var content = ContentService.GetById(1234); } ``` If Models Builder is enabled you can get the alias of the desired property without using a magic string: ```csharp @using Umbraco.Cms.Core.PublishedCache @inject IPublishedContentTypeCache PublishedContentTypeCache @{ // Set the value of the property with alias 'color' content.SetValue(Home.GetModelPropertyType(PublishedContentTypeCache, x => x.Color).Alias, "#6fa8dc"); // Set the value of the property with alias 'theme' content.SetValue(Home.GetModelPropertyType(PublishedContentTypeCache, x => x.Theme).Alias, "rgba(111, 168, 220, 0.7)"); } ```