
.. DO NOT EDIT.
.. THIS FILE WAS AUTOMATICALLY GENERATED BY SPHINX-GALLERY.
.. TO MAKE CHANGES, EDIT THE SOURCE PYTHON FILE:
.. "users/explain/colors/colors.py"
.. LINE NUMBERS ARE GIVEN BELOW.

.. only:: html

    .. meta::
        :keywords: codex

    .. note::
        :class: sphx-glr-download-link-note

        :ref:`Go to the end <sphx_glr_download_users_explain_colors_colors.py>`
        to download the full example code.

.. rst-class:: sphx-glr-example-title

.. _sphx_glr_users_explain_colors_colors.py:


.. redirect-from:: /tutorials/colors/colors

.. _colors_def:

*****************
Specifying colors
*****************

Color formats
=============

Matplotlib recognizes the following formats to specify a color.

+--------------------------------------+--------------------------------------+
| Format                               | Example                              |
+======================================+======================================+
| RGB or RGBA (red, green, blue, alpha)| - ``(0.1, 0.2, 0.5)``                |
| tuple of float values in a closed    | - ``(0.1, 0.2, 0.5, 0.3)``           |
| interval [0, 1].                     |                                      |
+--------------------------------------+--------------------------------------+
| Case-insensitive hex RGB or RGBA     | - ``'#0f0f0f'``                      |
| string.                              | - ``'#0f0f0f80'``                    |
+--------------------------------------+--------------------------------------+
| Case-insensitive RGB or RGBA string  | - ``'#abc'`` as ``'#aabbcc'``        |
| equivalent hex shorthand of          | - ``'#fb1'`` as ``'#ffbb11'``        |
| duplicated characters.               |                                      |
+--------------------------------------+--------------------------------------+
| String representation of float value | - ``'0'`` as black                   |
| in closed interval ``[0, 1]`` for    | - ``'1'`` as white                   |
| grayscale values.                    | - ``'0.8'`` as light gray            |
+--------------------------------------+--------------------------------------+
| Single character shorthand notation  | - ``'b'`` as blue                    |
| for some basic colors.               | - ``'g'`` as green                   |
|                                      | - ``'r'`` as red                     |
| .. note::                            | - ``'c'`` as cyan                    |
|    The colors green, cyan, magenta,  | - ``'m'`` as magenta                 |
|    and yellow do not coincide with   | - ``'y'`` as yellow                  |
|    X11/CSS4 colors. Their particular | - ``'k'`` as black                   |
|    shades were chosen for better     | - ``'w'`` as white                   |
|    visibility of colored lines       |                                      |
|    against typical backgrounds.      |                                      |
+--------------------------------------+--------------------------------------+
| Case-insensitive X11/CSS4 color name | - ``'aquamarine'``                   |
| with no spaces.                      | - ``'mediumseagreen'``               |
+--------------------------------------+--------------------------------------+
| Case-insensitive color name from     | - ``'xkcd:sky blue'``                |
| `xkcd color survey`_ with ``'xkcd:'``| - ``'xkcd:eggshell'``                |
| prefix.                              |                                      |
+--------------------------------------+--------------------------------------+
| Case-insensitive Tableau Colors from | - ``'tab:blue'``                     |
| 'T10' categorical palette.           | - ``'tab:orange'``                   |
|                                      | - ``'tab:green'``                    |
|                                      | - ``'tab:red'``                      |
|                                      | - ``'tab:purple'``                   |
| .. note:: This is the default color  | - ``'tab:brown'``                    |
|           cycle.                     | - ``'tab:pink'``                     |
|                                      | - ``'tab:gray'``                     |
|                                      | - ``'tab:olive'``                    |
|                                      | - ``'tab:cyan'``                     |
+--------------------------------------+--------------------------------------+
| "CN" color spec where ``'C'``        | - ``'C0'``                           |
| precedes a number acting as an index | - ``'C1'``                           |
| into the default property cycle.     +--------------------------------------+
|                                      | :rc:`axes.prop_cycle`                |
| .. note:: Matplotlib indexes color   |                                      |
|           at draw time and defaults  |                                      |
|           to black if cycle does not |                                      |
|           include color.             |                                      |
+--------------------------------------+--------------------------------------+
| Tuple of one of the above color      | - ``('green', 0.3)``                 |
| formats and an alpha float.          | - ``('#f00', 0.9)``                  |
|                                      |                                      |
| .. versionadded:: 3.8                |                                      |
+--------------------------------------+--------------------------------------+
| The special value "none" is fully    | - ``'none'``                         |
| transparent, i.e. equivalent to a    |                                      |
| RGBA value ``(0.0, 0.0, 0.0, 0.0)``  |                                      |
+--------------------------------------+--------------------------------------+

.. _xkcd color survey: https://xkcd.com/color/rgb/

.. seealso::

    The following links provide more information on colors in Matplotlib.
        * :doc:`/gallery/color/color_demo` Example
        * `matplotlib.colors` API
        * :doc:`/gallery/color/named_colors` Example

"Red", "Green", and "Blue" are the intensities of those colors. In combination,
they represent the colorspace.

Transparency
============

The *alpha* value of a color specifies its transparency, where 0 is fully
transparent and 1 is fully opaque. When a color is semi-transparent, the
background color will show through.

The *alpha* value determines the resulting color by blending the
foreground color with the background color according to the formula

.. math::

   RGB_{result} = RGB_{background} * (1 - \alpha) + RGB_{foreground} * \alpha

The following plot illustrates the effect of transparency.

.. GENERATED FROM PYTHON SOURCE LINES 109-130

.. code-block:: Python


    import matplotlib.pyplot as plt
    import numpy as np

    from matplotlib.patches import Rectangle

    fig, ax = plt.subplots(figsize=(6.5, 1.65), layout='constrained')
    ax.add_patch(Rectangle((-0.2, -0.35), 11.2, 0.7, color='C1', alpha=0.8))
    for i, alpha in enumerate(np.linspace(0, 1, 11)):
        ax.add_patch(Rectangle((i, 0.05), 0.8, 0.6, alpha=alpha, zorder=0))
        ax.text(i+0.4, 0.85, f"{alpha:.1f}", ha='center')
        ax.add_patch(Rectangle((i, -0.05), 0.8, -0.6, alpha=alpha, zorder=2))
    ax.set_xlim(-0.2, 13)
    ax.set_ylim(-1, 1)
    ax.set_title('alpha values')
    ax.text(11.3, 0.6, 'zorder=1', va='center', color='C0')
    ax.text(11.3, 0, 'zorder=2\nalpha=0.8', va='center', color='C1')
    ax.text(11.3, -0.6, 'zorder=3', va='center', color='C0')
    ax.axis('off')





.. image-sg:: /users/explain/colors/images/sphx_glr_colors_001.png
   :alt: alpha values
   :srcset: /users/explain/colors/images/sphx_glr_colors_001.png, /users/explain/colors/images/sphx_glr_colors_001_2_00x.png 2.00x
   :class: sphx-glr-single-img





.. GENERATED FROM PYTHON SOURCE LINES 131-144

The orange rectangle is semi-transparent with *alpha* = 0.8. The  top row of
blue squares is drawn below and the bottom row of blue squares is drawn on
top of the orange rectangle.

See also :doc:`/gallery/misc/zorder_demo` to learn more on the drawing order.


"CN" color selection
====================

Matplotlib converts "CN" colors to RGBA when drawing Artists. The
:ref:`color_cycle` section contains additional
information about controlling colors and style properties.

.. GENERATED FROM PYTHON SOURCE LINES 145-169

.. code-block:: Python



    import matplotlib.pyplot as plt
    import numpy as np

    import matplotlib as mpl

    th = np.linspace(0, 2*np.pi, 128)


    def demo(sty):
        mpl.style.use(sty)
        fig, ax = plt.subplots(figsize=(3, 3))

        ax.set_title(f'style: {sty!r}', color='C0')

        ax.plot(th, np.cos(th), 'C1', label='C1')
        ax.plot(th, np.sin(th), 'C2', label='C2')
        ax.legend()


    demo('default')
    demo('seaborn-v0_8')




.. rst-class:: sphx-glr-horizontal


    *

      .. image-sg:: /users/explain/colors/images/sphx_glr_colors_002.png
         :alt: style: 'default'
         :srcset: /users/explain/colors/images/sphx_glr_colors_002.png, /users/explain/colors/images/sphx_glr_colors_002_2_00x.png 2.00x
         :class: sphx-glr-multi-img

    *

      .. image-sg:: /users/explain/colors/images/sphx_glr_colors_003.png
         :alt: style: 'seaborn-v0_8'
         :srcset: /users/explain/colors/images/sphx_glr_colors_003.png, /users/explain/colors/images/sphx_glr_colors_003_2_00x.png 2.00x
         :class: sphx-glr-multi-img





.. GENERATED FROM PYTHON SOURCE LINES 170-192

The first color ``'C0'`` is the title. Each plot uses the second and third
colors of each style's :rc:`axes.prop_cycle`. They are ``'C1'`` and ``'C2'``,
respectively.

.. _xkcd-colors:

Comparison between X11/CSS4 and xkcd colors
===========================================

The xkcd colors come from a `user survey conducted by the webcomic xkcd
<https://blog.xkcd.com/2010/05/03/color-survey-results/>`__.

95 out of the 148 X11/CSS4 color names also appear in the xkcd color survey.
Almost all of them map to different color values in the X11/CSS4 and in
the xkcd palette. Only 'black', 'white' and 'cyan' are identical.

For example, ``'blue'`` maps to ``'#0000FF'`` whereas ``'xkcd:blue'`` maps to
``'#0343DF'``.  Due to these name collisions, all xkcd colors have the
``'xkcd:'`` prefix.

The visual below shows name collisions. Color names where color values agree
are in bold.

.. GENERATED FROM PYTHON SOURCE LINES 192-236

.. code-block:: Python


    import matplotlib.colors as mcolors
    import matplotlib.patches as mpatch

    overlap = {name for name in mcolors.CSS4_COLORS
               if f'xkcd:{name}' in mcolors.XKCD_COLORS}

    fig = plt.figure(figsize=[9, 5])
    ax = fig.add_axes([0, 0, 1, 1])

    n_groups = 3
    n_rows = len(overlap) // n_groups + 1

    for j, color_name in enumerate(sorted(overlap)):
        css4 = mcolors.CSS4_COLORS[color_name]
        xkcd = mcolors.XKCD_COLORS[f'xkcd:{color_name}'].upper()

        # Pick text colour based on perceived luminance.
        rgba = mcolors.to_rgba_array([css4, xkcd])
        luma = 0.299 * rgba[:, 0] + 0.587 * rgba[:, 1] + 0.114 * rgba[:, 2]
        css4_text_color = 'k' if luma[0] > 0.5 else 'w'
        xkcd_text_color = 'k' if luma[1] > 0.5 else 'w'

        col_shift = (j // n_rows) * 3
        y_pos = j % n_rows
        text_args = dict(fontsize=10, weight='bold' if css4 == xkcd else None)
        ax.add_patch(mpatch.Rectangle((0 + col_shift, y_pos), 1, 1, color=css4))
        ax.add_patch(mpatch.Rectangle((1 + col_shift, y_pos), 1, 1, color=xkcd))
        ax.text(0.5 + col_shift, y_pos + .7, css4,
                color=css4_text_color, ha='center', **text_args)
        ax.text(1.5 + col_shift, y_pos + .7, xkcd,
                color=xkcd_text_color, ha='center', **text_args)
        ax.text(2 + col_shift, y_pos + .7, f'  {color_name}', **text_args)

    for g in range(n_groups):
        ax.hlines(range(n_rows), 3*g, 3*g + 2.8, color='0.7', linewidth=1)
        ax.text(0.5 + 3*g, -0.3, 'X11/CSS4', ha='center')
        ax.text(1.5 + 3*g, -0.3, 'xkcd', ha='center')

    ax.set_xlim(0, 3 * n_groups)
    ax.set_ylim(n_rows, -1)
    ax.axis('off')

    plt.show()



.. image-sg:: /users/explain/colors/images/sphx_glr_colors_004.png
   :alt: colors
   :srcset: /users/explain/colors/images/sphx_glr_colors_004.png, /users/explain/colors/images/sphx_glr_colors_004_2_00x.png 2.00x
   :class: sphx-glr-single-img






.. _sphx_glr_download_users_explain_colors_colors.py:

.. only:: html

  .. container:: sphx-glr-footer sphx-glr-footer-example

    .. container:: sphx-glr-download sphx-glr-download-jupyter

      :download:`Download Jupyter notebook: colors.ipynb <colors.ipynb>`

    .. container:: sphx-glr-download sphx-glr-download-python

      :download:`Download Python source code: colors.py <colors.py>`

    .. container:: sphx-glr-download sphx-glr-download-zip

      :download:`Download zipped: colors.zip <colors.zip>`


.. only:: html

 .. rst-class:: sphx-glr-signature

    `Gallery generated by Sphinx-Gallery <https://sphinx-gallery.github.io>`_
