uicolorpicker

Create color picker component

Since R2024a

Syntax

c = uicolorpicker

c = uicolorpicker(parent)

c = uicolorpicker(___,Name=Value)

Description

c = uicolorpicker creates a color picker component in a new figure and returns the ColorPicker object. MATLAB^® calls the uifigure function to create the figure.

c = uicolorpicker(parent) creates a color picker in the specified parent container. The parent can be a Figure object created using the uifigure function or one of its child containers.

c = uicolorpicker(___,Name=Value) specifies ColorPicker properties using one or more name-value arguments. Use this option with any of the input argument combinations in the previous syntaxes. For example, uicolorpicker(Value="yellow") creates a color picker with an initial color value of yellow. For a list of properties, see ColorPicker Properties.

Examples

Create Color Picker

Create a color picker in a UI figure.

fig = uifigure;
c = uicolorpicker(fig);

The color picker allows an app user to choose from a set of standard colors or to select a custom color from a gradient.

Set and Access Color Picker Properties

Create a color picker in a UI figure and specify the initial color.

fig = uifigure;
c = uicolorpicker(fig,Value="blue");

Determine the location and size of the collapsed color picker by querying the Position property. The first two elements of the position vector specify the horizontal and vertical distance from the bottom-left corner of the figure, and the last two elements specify the color picker width and height.

pos = c.Position

pos = 1×4

   100   100    38    22

Increase the size of the color picker by changing the last two elements of the position vector.

c.Position(3:4) = [100 30];

Code Response to Color Selection

Create an app that changes the color of a plotted line when a user selects a color from a color picker.

In a file named choosePlotColor.m, write a function that implements the app:

• Create a UI figure and grid layout manager to lay out the app.

• Create UI axes, a label, and a color picker in the grid layout manager.

• Write a callback function named updateColor that changes the plot color based on the color picker selection, and assign the function to the ValueChangedFcn callback property of the color picker. For more information about callbacks, see Create Callbacks for Apps Created Programmatically.

function choosePlotColor
fig = uifigure;
g = uigridlayout(fig);
g.RowHeight = {'1x','fit'};
g.ColumnWidth = {'1x','fit','fit','1x'};

ax = uiaxes(g);
ax.Layout.Row = 1;
ax.Layout.Column = [1 4];

x = linspace(-2*pi,2*pi);
y = sin(x);
p = plot(ax,x,y);

lbl = uilabel(g,Text="Plot color:");
lbl.Layout.Row = 2;
lbl.Layout.Column = 2;

c = uicolorpicker(g, ...
    Value=p.Color, ...
    ValueChangedFcn=@(src,event) updateColor(src,event,p));
c.Layout.Row = 2;
c.Layout.Column = 3;
end

function updateColor(src,event,p)
val = event.Value;
p.Color = val;
end

Run the choosePlotColor function. Select a color from the color picker to update the plot.

Input Arguments

parent — Parent container

Figure object (default) | Tab object | Panel object | ButtonGroup object | GridLayout object

Parent container, specified as a Figure object created using the uifigure function or one of its child containers: Tab, Panel, ButtonGroup, or GridLayout. If you do not specify a parent container, MATLAB calls the uifigure function to create a new Figure object that serves as the parent container.

Name-Value Arguments

Specify optional pairs of arguments as Name1=Value1,...,NameN=ValueN, where Name is the argument name and Value is the corresponding value. Name-value arguments must appear after other arguments, but the order of the pairs does not matter.

Example: uicolorpicker(fig,Value="black") creates a color picker with an initial color value of black.

Note

The properties listed here are a subset of the available properties. For the full list, see ColorPicker Properties.

Value — Selected color

[1 0 0] (default) | RGB triplet | hexadecimal color code | "r" | "g" | "b" | ...

Selected color, specified as an RGB triplet, a hexadecimal color code, a color name, or a short name, and returned as an RGB triplet.

RGB triplets and hexadecimal color codes are useful for specifying custom colors.

• An RGB triplet is a three-element row vector whose elements specify the intensities of the red, green, and blue components of the color. The intensities must be in the range [0,1]; for example, [0.4 0.6 0.7].

• A hexadecimal color code is a character vector or a string scalar that starts with a hash symbol (#) followed by three or six hexadecimal digits, which can range from 0 to F. The values are not case sensitive. Thus, the color codes "#FF8800", "#ff8800", "#F80", and "#f80" are equivalent.

Alternatively, you can specify some common colors by name. This table lists the named color options, the equivalent RGB triplets, and hexadecimal color codes.

Color Name	Short Name	RGB Triplet	Hexadecimal Color Code	Appearance
"red"	"r"	[1 0 0]	"#FF0000"
"green"	"g"	[0 1 0]	"#00FF00"
"blue"	"b"	[0 0 1]	"#0000FF"
"cyan"	"c"	[0 1 1]	"#00FFFF"
"magenta"	"m"	[1 0 1]	"#FF00FF"
"yellow"	"y"	[1 1 0]	"#FFFF00"
"black"	"k"	[0 0 0]	"#000000"
"white"	"w"	[1 1 1]	"#FFFFFF"

Here are the RGB triplets and hexadecimal color codes for the default colors MATLAB uses in many types of plots.

RGB Triplet	Hexadecimal Color Code	Appearance
[0 0.4470 0.7410]	"#0072BD"
[0.8500 0.3250 0.0980]	"#D95319"
[0.9290 0.6940 0.1250]	"#EDB120"
[0.4940 0.1840 0.5560]	"#7E2F8E"
[0.4660 0.6740 0.1880]	"#77AC30"
[0.3010 0.7450 0.9330]	"#4DBEEE"
[0.6350 0.0780 0.1840]	"#A2142F"

Icon — Predefined or custom icon

'' (default) | string scalar | character vector | m-by-n-by-3 truecolor image array

Predefined or custom icon, specified as a string scalar, character vector, or m-by-n-by-3 truecolor image array.

Predefined Icon

This table lists the values to specify a predefined icon. Predefined icons appear above a swatch of the currently selected color.

Value	Appearance
'' (default)
'fill'
'line'
'text'

Custom Icon

Specify a custom icon as one of these values:

• A string scalar or character vector that specifies the filename of an SVG, JPEG, GIF, or PNG image that is on the MATLAB path. Alternatively, you can specify a full path to the image file.

• An m-by-n-by-3 truecolor image array. See Working with Image Types in MATLAB for more information.

If you plan to share an app with others, add the file image to the MATLAB path to facilitate app packaging.

ValueChangedFcn — Value changed callback

'' (default) | function handle | cell array | character vector

Value changed callback, specified as one of these values:

• A function handle.

• A cell array in which the first element is a function handle. Subsequent elements in the cell array are the arguments to pass to the callback function.

• A character vector containing a valid MATLAB expression (not recommended). MATLAB evaluates this expression in the base workspace.

The ValueChangedFcn callback executes when the user selects a new color using the color picker.

This callback function can access specific information about the user’s interaction with the color picker. MATLAB passes this information in a ValueChangedData object as the second argument to your callback function. In App Designer, the argument is named event. You can get the object properties using dot notation. For example, event.PreviousValue gets the previously selected color. The ValueChangedData object is not available to callback functions specified as character vectors.

This table lists the properties of the ValueChangedData object.

Property	Value
Value	New selected color
PreviousValue	Previously selected color
Source	Component that executes the callback
EventName	'ValueChanged'

The ValueChangedFcn callback does not execute when the user re-selects the currently selected color. The callback also does not execute when the Value property changes programmatically.

For more information about callbacks, see Create Callbacks for Apps Created Programmatically.

Position — Location and size

[100 100 38 22] (default) | [left bottom width height]

Location and size of the collapsed color picker relative to the parent container, specified as a vector of the form [left bottom width height]. This table describes each element in the vector.

Element	Description
left	Distance from the inner left edge of the parent container to the outer left edge of the color picker
bottom	Distance from the inner bottom edge of the parent container to the outer bottom edge of the color picker
width	Distance between the right and left outer edges of the color picker
height	Distance between the top and bottom outer edges of the color picker

All measurements are in pixel units.

Alternative Functionality

The uicolorpicker function creates a color picker that is embedded in an app. To launch a color picker dialog box outside of an app, such as from a script or function, use the uisetcolor function instead.

Version History

Introduced in R2024a