Symbol Overrides

When you select a Symbol instance in the Canvas, you might notice a list of Overrides in the Inspector, under the Symbol picker.

Overrides allow you to edit parts of your Symbol instance—so they keep the same basic elements defined in your Symbol—but allows them to have their own individual content, such as containing specific text, or images you might only need to appear once.

There are several override types that appear, depending on the type of layers your Symbol contains. These are organized by layer, in the Inspector. You can also determine which overrides appear in your instances from the Symbol master.

Focussing Overrides

When you have a Symbol instance selected, you will see all the overrides that are available to you in the Inspector. But you can choose to adjust specific overrides by selecting them in the Canvas or via the Layer List.

When a Symbol instance is selected, a highlight will appear when hovering over the overrides. Clicking one will focus the override inside the Symbol and isolate the override in the Inspector. You can also focus an override directly in the Layer List by clicking the disclosure triangle next to the Symbol instance’s name and choosing from the options. You can also Control-click an override in the Layer List to reveal options specific to it.

Focus Override

While an override is focussed, the Symbol instance layer will remain selected, so any actions such as moving and duplicating will apply only to that layer.

Nested Symbols

When a Symbol contains another Symbol, that is now nested. With overrides, you can swap out any nested Symbol, via the pop-up button in the Inspector with any other Symbol that is the same size, no matter if it belongs to the document, or to a Library.

You can also choose to display ‘None’, effectively hiding that Symbol from certain instances.

These nested overrides mean that you can have fewer Symbols that are similar, and have more power and control over individual instances.

Text

Symbols that contain text layers can have both their contents, and Text Style (if applied) overridden.

You can see the text layer’s original contents in grey, in the override field. Type into this and hit enter to apply your override. Clearing the field will reset the text back to what has been defined in the Symbol master.

Additionally, you can click the Data icon, to the right of the layer’s name in the Inspector, to automatically apply your chosen data source to the override.

When you update the text contents, its total length may change. As a result, Sketch will automatically move any trailing layers on left or right aligned text, and respect the distance between it and the end of the text layer so you can fully take advantages of Symbols and overrides, no matter your design.

To prevent a trailing layer’s position to update when editing a text override, simply lock the layer by Control-clicking it, and choosing “Lock Layer” from the shortcut menu.

Images

Any image layer, or shape that contains an image fill in a Symbol can be overridden. You can select Choose Image… to add an image from your computer, or drag one onto the image preview to the right.

Like text, you can also apply an image from a data source as an override by clicking the Data icon next to the image layer’s name.

To remove an image override, click the image preview and press the Backspace key.

Text and Layer Styles

Overriding a Text Style allows you to swap the style of the text layer with any other style in your document, or Library. Perfect for being able to change a text’s color if you defined two similar text styles.

Similarly, you can also override a Layer Style in the same way, by choosing a saved style from the pop-up menu.

Hotspots

Prototyping properties such as Hotspots can also be overridden. Adjusting a Hotspot’s override allows you to select the target Artboard, when it is part of a prototype.

Setting a target to None will stop the override linking to another Artboard when previewing the prototype.

Managing Overrides

By default, any of the above layer types will appear as overrides when the Symbol’s instance is selected. However, you can determine which overrides will appear for your Symbol, directly in the Symbol Master.

Just select the Symbol Artboard, and you’ll see the Manage Overrides section in the Inspector. Overridable properties are organized by layer and will affect what can be edited in any instances of that Symbol.

Managing Overrides

Resetting Overrides

If you have made a number of overrides to an instance, and would like to reset them to what is being used in the master, click the Reset icon at the top of the overrides section.

Last modified on Apr 23, 2019

Was this article useful?

Yes
No

We’re really sorry about that.
Please let us know what you were looking for:

If you need more help or you’d like to report a bug with this content, please contact support.

Thanks for your feedback.
An error occurred, please try again later.

Start working faster today

Available exclusively on the Mac for just $99.