godot-docs/classes/class_colorpicker.rst

:github_url: hide

.. DO NOT EDIT THIS FILE!!!
.. Generated automatically from Godot engine sources.
.. Generator: https://github.com/godotengine/godot/tree/master/doc/tools/make_rst.py.
.. XML source: https://github.com/godotengine/godot/tree/master/doc/classes/ColorPicker.xml.

.. _class_ColorPicker:

ColorPicker
===========

**Inherits:** :ref:`BoxContainer<class_BoxContainer>` **<** :ref:`Container<class_Container>` **<** :ref:`Control<class_Control>` **<** :ref:`CanvasItem<class_CanvasItem>` **<** :ref:`Node<class_Node>` **<** :ref:`Object<class_Object>`

Color picker control.

Description
-----------

Displays a color picker widget. Useful for selecting a color from an RGB/RGBA colorspace.

\ **Note:** This control is the color picker widget itself. You can use a :ref:`ColorPickerButton<class_ColorPickerButton>` instead if you need a button that brings up a ``ColorPicker`` in a pop-up.

Tutorials
---------

- `Tween Demo <https://godotengine.org/asset-library/asset/146>`__

Properties
----------

+----------------------------------------------------------+--------------------------------------------------------------------+--------------------------------------------------------------------------------+
| :ref:`Color<class_Color>`                                | :ref:`color<class_ColorPicker_property_color>`                     | ``Color(1, 1, 1, 1)``                                                          |
+----------------------------------------------------------+--------------------------------------------------------------------+--------------------------------------------------------------------------------+
| :ref:`ColorModeType<enum_ColorPicker_ColorModeType>`     | :ref:`color_mode<class_ColorPicker_property_color_mode>`           | ``0``                                                                          |
+----------------------------------------------------------+--------------------------------------------------------------------+--------------------------------------------------------------------------------+
| :ref:`bool<class_bool>`                                  | :ref:`deferred_mode<class_ColorPicker_property_deferred_mode>`     | ``false``                                                                      |
+----------------------------------------------------------+--------------------------------------------------------------------+--------------------------------------------------------------------------------+
| :ref:`bool<class_bool>`                                  | :ref:`edit_alpha<class_ColorPicker_property_edit_alpha>`           | ``true``                                                                       |
+----------------------------------------------------------+--------------------------------------------------------------------+--------------------------------------------------------------------------------+
| :ref:`PickerShapeType<enum_ColorPicker_PickerShapeType>` | :ref:`picker_shape<class_ColorPicker_property_picker_shape>`       | ``0``                                                                          |
+----------------------------------------------------------+--------------------------------------------------------------------+--------------------------------------------------------------------------------+
| :ref:`bool<class_bool>`                                  | :ref:`presets_enabled<class_ColorPicker_property_presets_enabled>` | ``true``                                                                       |
+----------------------------------------------------------+--------------------------------------------------------------------+--------------------------------------------------------------------------------+
| :ref:`bool<class_bool>`                                  | :ref:`presets_visible<class_ColorPicker_property_presets_visible>` | ``true``                                                                       |
+----------------------------------------------------------+--------------------------------------------------------------------+--------------------------------------------------------------------------------+
| :ref:`bool<class_bool>`                                  | vertical                                                           | ``true`` (overrides :ref:`BoxContainer<class_BoxContainer_property_vertical>`) |
+----------------------------------------------------------+--------------------------------------------------------------------+--------------------------------------------------------------------------------+

Methods
-------

+-------------------------------------------------+----------------------------------------------------------------------------------------------------------------------+
| void                                            | :ref:`add_preset<class_ColorPicker_method_add_preset>` **(** :ref:`Color<class_Color>` color **)**                   |
+-------------------------------------------------+----------------------------------------------------------------------------------------------------------------------+
| void                                            | :ref:`add_recent_preset<class_ColorPicker_method_add_recent_preset>` **(** :ref:`Color<class_Color>` color **)**     |
+-------------------------------------------------+----------------------------------------------------------------------------------------------------------------------+
| void                                            | :ref:`erase_preset<class_ColorPicker_method_erase_preset>` **(** :ref:`Color<class_Color>` color **)**               |
+-------------------------------------------------+----------------------------------------------------------------------------------------------------------------------+
| void                                            | :ref:`erase_recent_preset<class_ColorPicker_method_erase_recent_preset>` **(** :ref:`Color<class_Color>` color **)** |
+-------------------------------------------------+----------------------------------------------------------------------------------------------------------------------+
| :ref:`PackedColorArray<class_PackedColorArray>` | :ref:`get_presets<class_ColorPicker_method_get_presets>` **(** **)** |const|                                         |
+-------------------------------------------------+----------------------------------------------------------------------------------------------------------------------+
| :ref:`PackedColorArray<class_PackedColorArray>` | :ref:`get_recent_presets<class_ColorPicker_method_get_recent_presets>` **(** **)** |const|                           |
+-------------------------------------------------+----------------------------------------------------------------------------------------------------------------------+

Theme Properties
----------------

+-----------------------------------+--------------------------------------------------------------------------------+---------+
| :ref:`int<class_int>`             | :ref:`h_width<class_ColorPicker_theme_constant_h_width>`                       | ``30``  |
+-----------------------------------+--------------------------------------------------------------------------------+---------+
| :ref:`int<class_int>`             | :ref:`label_width<class_ColorPicker_theme_constant_label_width>`               | ``10``  |
+-----------------------------------+--------------------------------------------------------------------------------+---------+
| :ref:`int<class_int>`             | :ref:`margin<class_ColorPicker_theme_constant_margin>`                         | ``4``   |
+-----------------------------------+--------------------------------------------------------------------------------+---------+
| :ref:`int<class_int>`             | :ref:`sv_height<class_ColorPicker_theme_constant_sv_height>`                   | ``256`` |
+-----------------------------------+--------------------------------------------------------------------------------+---------+
| :ref:`int<class_int>`             | :ref:`sv_width<class_ColorPicker_theme_constant_sv_width>`                     | ``256`` |
+-----------------------------------+--------------------------------------------------------------------------------+---------+
| :ref:`Texture2D<class_Texture2D>` | :ref:`add_preset<class_ColorPicker_theme_icon_add_preset>`                     |         |
+-----------------------------------+--------------------------------------------------------------------------------+---------+
| :ref:`Texture2D<class_Texture2D>` | :ref:`bar_arrow<class_ColorPicker_theme_icon_bar_arrow>`                       |         |
+-----------------------------------+--------------------------------------------------------------------------------+---------+
| :ref:`Texture2D<class_Texture2D>` | :ref:`color_hue<class_ColorPicker_theme_icon_color_hue>`                       |         |
+-----------------------------------+--------------------------------------------------------------------------------+---------+
| :ref:`Texture2D<class_Texture2D>` | :ref:`expanded_arrow<class_ColorPicker_theme_icon_expanded_arrow>`             |         |
+-----------------------------------+--------------------------------------------------------------------------------+---------+
| :ref:`Texture2D<class_Texture2D>` | :ref:`folded_arrow<class_ColorPicker_theme_icon_folded_arrow>`                 |         |
+-----------------------------------+--------------------------------------------------------------------------------+---------+
| :ref:`Texture2D<class_Texture2D>` | :ref:`overbright_indicator<class_ColorPicker_theme_icon_overbright_indicator>` |         |
+-----------------------------------+--------------------------------------------------------------------------------+---------+
| :ref:`Texture2D<class_Texture2D>` | :ref:`picker_cursor<class_ColorPicker_theme_icon_picker_cursor>`               |         |
+-----------------------------------+--------------------------------------------------------------------------------+---------+
| :ref:`Texture2D<class_Texture2D>` | :ref:`sample_bg<class_ColorPicker_theme_icon_sample_bg>`                       |         |
+-----------------------------------+--------------------------------------------------------------------------------+---------+
| :ref:`Texture2D<class_Texture2D>` | :ref:`screen_picker<class_ColorPicker_theme_icon_screen_picker>`               |         |
+-----------------------------------+--------------------------------------------------------------------------------+---------+
| :ref:`Texture2D<class_Texture2D>` | :ref:`shape_circle<class_ColorPicker_theme_icon_shape_circle>`                 |         |
+-----------------------------------+--------------------------------------------------------------------------------+---------+
| :ref:`Texture2D<class_Texture2D>` | :ref:`shape_rect<class_ColorPicker_theme_icon_shape_rect>`                     |         |
+-----------------------------------+--------------------------------------------------------------------------------+---------+
| :ref:`Texture2D<class_Texture2D>` | :ref:`shape_rect_wheel<class_ColorPicker_theme_icon_shape_rect_wheel>`         |         |
+-----------------------------------+--------------------------------------------------------------------------------+---------+

Signals
-------

.. _class_ColorPicker_signal_color_changed:

- **color_changed** **(** :ref:`Color<class_Color>` color **)**

Emitted when the color is changed.

----

.. _class_ColorPicker_signal_preset_added:

- **preset_added** **(** :ref:`Color<class_Color>` color **)**

Emitted when a preset is added.

----

.. _class_ColorPicker_signal_preset_removed:

- **preset_removed** **(** :ref:`Color<class_Color>` color **)**

Emitted when a preset is removed.

Enumerations
------------

.. _enum_ColorPicker_ColorModeType:

.. _class_ColorPicker_constant_MODE_RGB:

.. _class_ColorPicker_constant_MODE_HSV:

.. _class_ColorPicker_constant_MODE_RAW:

.. _class_ColorPicker_constant_MODE_OKHSL:

enum **ColorModeType**:

- **MODE_RGB** = **0** --- Allows editing the color with Red/Green/Blue sliders.

- **MODE_HSV** = **1** --- Allows editing the color with Hue/Saturation/Value sliders.

- **MODE_RAW** = **2** --- Allows the color R, G, B component values to go beyond 1.0, which can be used for certain special operations that require it (like tinting without darkening or rendering sprites in HDR).

- **MODE_OKHSL** = **3** --- Allows editing the color with Hue/Saturation/Lightness sliders.

OKHSL is a new color space similar to HSL but that better match perception by leveraging the Oklab color space which is designed to be simple to use, while doing a good job at predicting perceived lightness, chroma and hue.

\ `Okhsv and Okhsl color spaces <https://bottosson.github.io/posts/colorpicker/>`__

----

.. _enum_ColorPicker_PickerShapeType:

.. _class_ColorPicker_constant_SHAPE_HSV_RECTANGLE:

.. _class_ColorPicker_constant_SHAPE_HSV_WHEEL:

.. _class_ColorPicker_constant_SHAPE_VHS_CIRCLE:

.. _class_ColorPicker_constant_SHAPE_OKHSL_CIRCLE:

enum **PickerShapeType**:

- **SHAPE_HSV_RECTANGLE** = **0** --- HSV Color Model rectangle color space.

- **SHAPE_HSV_WHEEL** = **1** --- HSV Color Model rectangle color space with a wheel.

- **SHAPE_VHS_CIRCLE** = **2** --- HSV Color Model circle color space. Use Saturation as a radius.

- **SHAPE_OKHSL_CIRCLE** = **3** --- HSL OK Color Model circle color space.

Property Descriptions
---------------------

.. _class_ColorPicker_property_color:

- :ref:`Color<class_Color>` **color**

+-----------+-----------------------+
| *Default* | ``Color(1, 1, 1, 1)`` |
+-----------+-----------------------+
| *Setter*  | set_pick_color(value) |
+-----------+-----------------------+
| *Getter*  | get_pick_color()      |
+-----------+-----------------------+

The currently selected color.

----

.. _class_ColorPicker_property_color_mode:

- :ref:`ColorModeType<enum_ColorPicker_ColorModeType>` **color_mode**

+-----------+-----------------------+
| *Default* | ``0``                 |
+-----------+-----------------------+
| *Setter*  | set_color_mode(value) |
+-----------+-----------------------+
| *Getter*  | get_color_mode()      |
+-----------+-----------------------+

The currently selected color mode. See :ref:`ColorModeType<enum_ColorPicker_ColorModeType>`.

----

.. _class_ColorPicker_property_deferred_mode:

- :ref:`bool<class_bool>` **deferred_mode**

+-----------+--------------------------+
| *Default* | ``false``                |
+-----------+--------------------------+
| *Setter*  | set_deferred_mode(value) |
+-----------+--------------------------+
| *Getter*  | is_deferred_mode()       |
+-----------+--------------------------+

If ``true``, the color will apply only after the user releases the mouse button, otherwise it will apply immediately even in mouse motion event (which can cause performance issues).

----

.. _class_ColorPicker_property_edit_alpha:

- :ref:`bool<class_bool>` **edit_alpha**

+-----------+-----------------------+
| *Default* | ``true``              |
+-----------+-----------------------+
| *Setter*  | set_edit_alpha(value) |
+-----------+-----------------------+
| *Getter*  | is_editing_alpha()    |
+-----------+-----------------------+

If ``true``, shows an alpha channel slider (opacity).

----

.. _class_ColorPicker_property_picker_shape:

- :ref:`PickerShapeType<enum_ColorPicker_PickerShapeType>` **picker_shape**

+-----------+-------------------------+
| *Default* | ``0``                   |
+-----------+-------------------------+
| *Setter*  | set_picker_shape(value) |
+-----------+-------------------------+
| *Getter*  | get_picker_shape()      |
+-----------+-------------------------+

The shape of the color space view. See :ref:`PickerShapeType<enum_ColorPicker_PickerShapeType>`.

----

.. _class_ColorPicker_property_presets_enabled:

- :ref:`bool<class_bool>` **presets_enabled**

+-----------+----------------------------+
| *Default* | ``true``                   |
+-----------+----------------------------+
| *Setter*  | set_presets_enabled(value) |
+-----------+----------------------------+
| *Getter*  | are_presets_enabled()      |
+-----------+----------------------------+

If ``true``, the "add preset" button is enabled.

----

.. _class_ColorPicker_property_presets_visible:

- :ref:`bool<class_bool>` **presets_visible**

+-----------+----------------------------+
| *Default* | ``true``                   |
+-----------+----------------------------+
| *Setter*  | set_presets_visible(value) |
+-----------+----------------------------+
| *Getter*  | are_presets_visible()      |
+-----------+----------------------------+

If ``true``, saved color presets are visible.

Method Descriptions
-------------------

.. _class_ColorPicker_method_add_preset:

- void **add_preset** **(** :ref:`Color<class_Color>` color **)**

Adds the given color to a list of color presets. The presets are displayed in the color picker and the user will be able to select them.

\ **Note:** The presets list is only for *this* color picker.

----

.. _class_ColorPicker_method_add_recent_preset:

- void **add_recent_preset** **(** :ref:`Color<class_Color>` color **)**

Adds the given color to a list of color recent presets so that it can be picked later. Recent presets are the colors that were picked recently, a new preset is automatically created and added to recent presets when you pick a new color.

\ **Note:** The recent presets list is only for *this* color picker.

----

.. _class_ColorPicker_method_erase_preset:

- void **erase_preset** **(** :ref:`Color<class_Color>` color **)**

Removes the given color from the list of color presets of this color picker.

----

.. _class_ColorPicker_method_erase_recent_preset:

- void **erase_recent_preset** **(** :ref:`Color<class_Color>` color **)**

Removes the given color from the list of color recent presets of this color picker.

----

.. _class_ColorPicker_method_get_presets:

- :ref:`PackedColorArray<class_PackedColorArray>` **get_presets** **(** **)** |const|

Returns the list of colors in the presets of the color picker.

----

.. _class_ColorPicker_method_get_recent_presets:

- :ref:`PackedColorArray<class_PackedColorArray>` **get_recent_presets** **(** **)** |const|

Returns the list of colors in the recent presets of the color picker.

Theme Property Descriptions
---------------------------

.. _class_ColorPicker_theme_constant_h_width:

- :ref:`int<class_int>` **h_width**

+-----------+--------+
| *Default* | ``30`` |
+-----------+--------+

The width of the hue selection slider.

----

.. _class_ColorPicker_theme_constant_label_width:

- :ref:`int<class_int>` **label_width**

+-----------+--------+
| *Default* | ``10`` |
+-----------+--------+

----

.. _class_ColorPicker_theme_constant_margin:

- :ref:`int<class_int>` **margin**

+-----------+-------+
| *Default* | ``4`` |
+-----------+-------+

The margin around the ``ColorPicker``.

----

.. _class_ColorPicker_theme_constant_sv_height:

- :ref:`int<class_int>` **sv_height**

+-----------+---------+
| *Default* | ``256`` |
+-----------+---------+

The height of the saturation-value selection box.

----

.. _class_ColorPicker_theme_constant_sv_width:

- :ref:`int<class_int>` **sv_width**

+-----------+---------+
| *Default* | ``256`` |
+-----------+---------+

The width of the saturation-value selection box.

----

.. _class_ColorPicker_theme_icon_add_preset:

- :ref:`Texture2D<class_Texture2D>` **add_preset**

The icon for the "Add Preset" button.

----

.. _class_ColorPicker_theme_icon_bar_arrow:

- :ref:`Texture2D<class_Texture2D>` **bar_arrow**

The texture for the arrow grabber.

----

.. _class_ColorPicker_theme_icon_color_hue:

- :ref:`Texture2D<class_Texture2D>` **color_hue**

Custom texture for the hue selection slider on the right.

----

.. _class_ColorPicker_theme_icon_expanded_arrow:

- :ref:`Texture2D<class_Texture2D>` **expanded_arrow**

The icon for color preset drop down menu when expanded.

----

.. _class_ColorPicker_theme_icon_folded_arrow:

- :ref:`Texture2D<class_Texture2D>` **folded_arrow**

The icon for color preset drop down menu when folded.

----

.. _class_ColorPicker_theme_icon_overbright_indicator:

- :ref:`Texture2D<class_Texture2D>` **overbright_indicator**

The indicator used to signalize that the color value is outside the 0-1 range.

----

.. _class_ColorPicker_theme_icon_picker_cursor:

- :ref:`Texture2D<class_Texture2D>` **picker_cursor**

----

.. _class_ColorPicker_theme_icon_sample_bg:

- :ref:`Texture2D<class_Texture2D>` **sample_bg**

----

.. _class_ColorPicker_theme_icon_screen_picker:

- :ref:`Texture2D<class_Texture2D>` **screen_picker**

The icon for the screen color picker button.

----

.. _class_ColorPicker_theme_icon_shape_circle:

- :ref:`Texture2D<class_Texture2D>` **shape_circle**

The icon for circular picker shapes.

----

.. _class_ColorPicker_theme_icon_shape_rect:

- :ref:`Texture2D<class_Texture2D>` **shape_rect**

The icon for rectangular picker shapes.

----

.. _class_ColorPicker_theme_icon_shape_rect_wheel:

- :ref:`Texture2D<class_Texture2D>` **shape_rect_wheel**

The icon for rectangular wheel picker shapes.

.. |virtual| replace:: :abbr:`virtual (This method should typically be overridden by the user to have any effect.)`
.. |const| replace:: :abbr:`const (This method has no side effects. It doesn't modify any of the instance's member variables.)`
.. |vararg| replace:: :abbr:`vararg (This method accepts any number of arguments after the ones described here.)`
.. |constructor| replace:: :abbr:`constructor (This method is used to construct a type.)`
.. |static| replace:: :abbr:`static (This method doesn't need an instance to be called, so it can be called directly using the class name.)`
.. |operator| replace:: :abbr:`operator (This method describes a valid operator to use with this type as left-hand operand.)`