# Toggle

In order for a Toggle from Figma to be imported to Unity automatically, certain rules apply when designing a toggle in Figma.

<figure><img src="https://1621352894-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FbxGkHH9nbw4PqGFuLmzb%2Fuploads%2FBCMk0DGuhJU7ehg5mDeT%2FEkran%20Resmi%202024-05-22%2008.52.23.png?alt=media&#x26;token=a60a3701-8098-456a-848f-504f612f14cb" alt="" width="375"><figcaption><p>A toggle component set in Figma</p></figcaption></figure>

### Unity Importer Plugin

In order for Figma Importer to understand which component it is trying to convert a figma node to a Unity UI element, Component Type from Unity Importer plugin must be selected as desired component type. "Toggle" component type should be selected when designing a toggle.&#x20;

### "State" variant

Toggles have 4 states: Default, Hover, Press, Disabled. These states must be designed as variants of a toggle component in Figma. The variant name in Figma must be "State" otherwise the importer won't be able to identify it.&#x20;

### "Checked" variant

Toggles have 2 condition: On or Off. Checked variant is used with combination of State variant. So, a variant of a Toggle component set may be: Default, Checked On. The variant name in Figma must be "Checked" otherwise the importer won't be able to identify it.

{% hint style="info" %}
The hierarchy of child nodes of a component set's variant must be the same for each and every one of them.&#x20;
{% endhint %}

<div><figure><img src="https://1621352894-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FbxGkHH9nbw4PqGFuLmzb%2Fuploads%2FDJpVYbfoDrvoUNt3pWbS%2FEkran%20Resmi%202024-05-22%2008.52.58.png?alt=media&#x26;token=316d4e41-63d8-4406-ba60-28d881730698" alt="" width="372"><figcaption></figcaption></figure> <figure><img src="https://1621352894-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FbxGkHH9nbw4PqGFuLmzb%2Fuploads%2FHRsVQvOntnWCxOpECcSF%2FEkran%20Resmi%202024-05-22%2008.53.16.png?alt=media&#x26;token=6eb88554-8e48-40e2-8668-cec7abf87a71" alt="" width="228"><figcaption></figcaption></figure></div>

{% hint style="info" %}
Keep in mind that components & component sets are never imported to Unity, only instances of them are imported.
{% endhint %}
