As designed by `Canonical <https://www.canonical.com/>`__, we use the following system palette (from `Michał Prędotka <http://colors.mivoligo.com/>`__ and `Ubuntu documentation <https://docs.ubuntu.com/phone/en/apps/api-qml-development/Ubuntu.Components.UbuntuColors>`__):

Operating system and app palette
================================

.. figure:: /_static/images/humanguide/color-white.svg

-  #FFFFFF White

Recommended for background on Ambiance theme (light theme) or regular text on Suru Dark theme.

.. figure:: /_static/images/humanguide/color-TextGrey.svg

-  #111111 Jet

Recommended for regular text on Ambiance theme or background in Suru Dark.

.. figure:: /_static/images/humanguide/UT-color-inkstone.svg

-  #3B3B3B Inkstone

Recommended for foreground colours in dark themes.

.. figure:: /_static/images/humanguide/UT-color-Slate.svg

-  #5D5D5D Slate

Recommended for text and action icons.

.. figure:: /_static/images/humanguide/UT-color-Graphite.svg

-  #666666 Graphite

Recommended for coloring dark themes' background.

.. figure:: /_static/images/humanguide/UT-color-Ash.svg

-  #888888 Ash

Recommended for subtitles and other tertiary content.

.. figure:: /_static/images/humanguide/UT-color-Silk.svg

-  #CDCDCD Silk

Recommended for neutral action buttons and secondary text.

.. figure:: /_static/images/humanguide/UT-color-Porcelain.svg

-  #F7F7F7 Porcelain

Recommended for foregrounds.

.. figure:: /_static/images/humanguide/UT-color-Blue.svg

-  #335280 Blue

Recommended for progress bars, selected areas, text selection and text cursor. Also neutral actions (Ambiance).

.. figure:: /_static/images/humanguide/UT-color-lightBlue.svg

-  #19B6EE Light Blue

Recommended for progress bars, selected areas, text selection and text cursor. Also neutral actions (SuruDark).

.. figure:: /_static/images/humanguide/UT-color-Green.svg

-  #0E8420 Green

Recommended for positive action buttons (Ambiance).

.. figure:: /_static/images/humanguide/UT-color-lightGreen.svg

-  #3EB34F Light Green

Recommended for positive action buttons (SuruDark).

.. figure:: /_static/images/humanguide/color-Red.svg

-  #C7162B Red

Recommended for negative and irreversible action buttons, errors and alerts (Ambiance).

.. figure:: /_static/images/humanguide/color-lightRed.svg

-  #ED3146 Light Red

Recommended for negative and irreversible action buttons, errors and alerts (SuruDark).

.. figure:: /_static/images/humanguide/color-orange.svg

-  #E95420 Orange

Orange is recommended for branded elements, focus and intensity.