Use Styles, Variables, and Design Libraries
Reuse colours, text formatting and values in a Design file with Styles and Variables, and share them with a team as a Design Library.
A Style is a reusable appearance. Select a Layer, open Assets, and choose New Style. A Style records its fill, stroke, corners, opacity, Text formatting, and current Variable bindings. Select other Layers and choose Apply beside the Style. To replace a Style with the selected Layer's appearance and update its bound Layers, choose Update. Select a bound Layer and choose Detach style in the Inspector to keep its current appearance without receiving later Style updates.
Variables are stored in Collections. Assets can create Color, Number, Text, and Boolean Variables. Expand a Collection's settings to edit its name, modes, and Variables. Each mode has its own value. The Current and default mode is used on the canvas and when a Prototype starts; changing it updates bound Layers. Prototype actions can switch modes during playback.
A Variable's scope controls where Apply can bind it:
- Color: fill, stroke, or Text colour.
- Number: opacity, corner radius, Text size, Auto Layout gap, or padding.
- Text: Text content.
- Boolean: Layer visibility.
All uses the usual property for that type. Existing bindings keep their property if the scope changes. The Inspector lists every binding on a selected Layer. Choose Remove to keep the current value and remove that binding.
A mode value can be a literal value or an alias to another Variable of the same type in its Collection. Aliases use the target Variable's value in the current mode. Circular aliases are rejected. The optional Code name records the name developers use for the Variable.
Local Components, Styles, and Variables appear in Assets. A team administrator can publish the file's reusable assets as a Design Library: open the Assets tab and choose Libraries. Publishing creates a numbered version with a release note; a published version does not change. An editor can enable a team Library from the same drawer. Its published Components, Styles, and Variables then appear in Assets.
A new Library version does not change a file that uses it while someone is editing it. The drawer reports an available version; choose Update to use it. Component Instances keep the version and the Layers they had when they were inserted. Select an Instance and choose Update to use the newly pinned source while retaining its supported overrides. Styles and Variables copied from a Library keep local records and bindings. Applying a Library Style also copies the Variable Collections that the Style uses, so its bindings remain valid in the consuming file.
If an enabled Library does not offer its published assets, Contact support.
Den Magpie-Support fragen
Senden Sie dem Magpie-Team eine Frage zu allem, was dieser Artikel nicht beantwortet.