Main Content

uicolorpicker

Create color picker component

Since R2024a

collapse all in page

    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.

    example

    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.

    example

    Examples

    collapse all

    Open Live Script

    Create a color picker in a UI figure.

    fig = uifigure;
c = uicolorpicker(fig);

    Figure contains an object of type uicolorpicker.

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

    Two views of an expanded color picker component. The Standard Colors view shows predefined common colors, recent colors, and a preview of the selected color. The Custom Colors view shows a color gradient, controls to specify RGB color values, and a preview of the selected color.

    Open Live Script

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

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

    Figure contains an object of type uicolorpicker.

    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];

    Figure contains an object of type uicolorpicker.

    Open Live Script

    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.

    UI figure window with some plotted data and a color picker labeled "Plot color". The color picker is expanded, and the selected color matches the color of the plot.

    Input Arguments

    collapse all

    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.

    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 NameShort NameRGB TripletHexadecimal Color CodeAppearance
    "red""r"[1 0 0]"#FF0000"

    Sample of the color red

    "green""g"[0 1 0]"#00FF00"

    Sample of the color green

    "blue""b"[0 0 1]"#0000FF"

    Sample of the color blue

    "cyan" "c"[0 1 1]"#00FFFF"

    Sample of the color cyan

    "magenta""m"[1 0 1]"#FF00FF"

    Sample of the color magenta

    "yellow""y"[1 1 0]"#FFFF00"

    Sample of the color yellow

    "black""k"[0 0 0]"#000000"

    Sample of the color black

    "white""w"[1 1 1]"#FFFFFF"

    Sample of the color white

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

    RGB TripletHexadecimal Color CodeAppearance
    [0 0.4470 0.7410]"#0072BD"

    Sample of RGB triplet [0 0.4470 0.7410], which appears as dark blue

    [0.8500 0.3250 0.0980]"#D95319"

    Sample of RGB triplet [0.8500 0.3250 0.0980], which appears as dark orange

    [0.9290 0.6940 0.1250]"#EDB120"

    Sample of RGB triplet [0.9290 0.6940 0.1250], which appears as dark yellow

    [0.4940 0.1840 0.5560]"#7E2F8E"

    Sample of RGB triplet [0.4940 0.1840 0.5560], which appears as dark purple

    [0.4660 0.6740 0.1880]"#77AC30"

    Sample of RGB triplet [0.4660 0.6740 0.1880], which appears as medium green

    [0.3010 0.7450 0.9330]"#4DBEEE"

    Sample of RGB triplet [0.3010 0.7450 0.9330], which appears as light blue

    [0.6350 0.0780 0.1840]"#A2142F"

    Sample of RGB triplet [0.6350 0.0780 0.1840], which appears as dark red

    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.

    ValueAppearance
    '' (default)

    Color picker with a red rectangle

    'fill'

    Color picker with a bucket icon above a red rectangle

    'line'

    Color picker with a pen icon above a red rectangle

    'text'

    Color picker with a capital A icon above a red rectangle

    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.

    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.

    PropertyValue
    ValueNew selected color
    PreviousValuePreviously selected color
    SourceComponent 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.

    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.

    ElementDescription
    leftDistance from the inner left edge of the parent container to the outer left edge of the color picker
    bottomDistance from the inner bottom edge of the parent container to the outer bottom edge of the color picker
    widthDistance between the right and left outer edges of the color picker
    heightDistance 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

    See Also

    Functions

    Properties

    Tools