Shared Colors

You can create Shared Colors and use them throughout your design. When you edit a Shared Color, the color will update wherever you’ve used it.


To create a Shared Color, select a Frame and then click on the Fill property to open the color picker. Select Shared Colors from the dropdown menu, then click the the + icon.

On the New Shared Color screen, enter a name for the new color, choose a color in the picker, then click Create. The Shared Colors list will now include your new shared color.

Tip: We recommend choosing a semantic name that describes the function or purpose of the color rather than its appearance.


To edit a shared color, click the Edit button next to the color’s name in the Shared Colors list.

On the Edit Shared Color screen, you can change the color’s name or pick a new color in the picker. Click Done to confirm your changes.

Package Colors

Both Public and Team packages can include shared colors. If you have installed a package that includes shared colors, the color picker’s dropdown will list the package’s name alongside Custom and Shared Colors.

To view or use a package’s shared colors, select its name from the dropdown.