# Figma file

<table data-view="cards"><thead><tr><th></th><th data-hidden data-card-cover data-type="files"></th><th data-hidden data-card-target data-type="content-ref"></th></tr></thead><tbody><tr><td>Download FloatGrids Figma file</td><td><a href="https://2267467073-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FJTYM2H0ve8KmqJHIoHBt%2Fuploads%2FTQ1e49YpdC6ICaHaH1JV%2FFrame%204.jpg?alt=media&#x26;token=6d0d68b1-70d6-407c-a8ee-472fdf19d982">Frame 4.jpg</a></td><td><a href="https://www.figma.com/community/file/1087168911388362853">https://www.figma.com/community/file/1087168911388362853</a></td></tr></tbody></table>

## Learn how to design for XR using the Figma file

In the FloatGrids Figma file you'll find recommendations, examples and best practices about how to design UI for XR apps. You'll learn concepts such as distances, focus area, text sizes or components sizes.

<figure><img src="https://2267467073-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FJTYM2H0ve8KmqJHIoHBt%2Fuploads%2Fy0Pxne4AhClqolGeeOIy%2Fimage.png?alt=media&#x26;token=50e36005-418a-4e35-8f40-0a29e9e5c26c" alt=""><figcaption><p>7 ready-to-use layouts</p></figcaption></figure>

<figure><img src="https://2267467073-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FJTYM2H0ve8KmqJHIoHBt%2Fuploads%2FMZhR1CYAPN5ywsACqEQZ%2Fimage.png?alt=media&#x26;token=b1ef8291-1447-407a-bcdb-983a2d3a93b5" alt=""><figcaption><p>FloatGrids foundations</p></figcaption></figure>

<figure><img src="https://2267467073-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FJTYM2H0ve8KmqJHIoHBt%2Fuploads%2FCINugXkyCfULfUe51X4Q%2Fimage.png?alt=media&#x26;token=792d7217-82c9-4b0d-8da7-290e74a268e5" alt=""><figcaption><p>10 different button styles </p></figcaption></figure>

<figure><img src="https://2267467073-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FJTYM2H0ve8KmqJHIoHBt%2Fuploads%2F1WONCJeWR2DJq3dZZRMx%2Fimage.png?alt=media&#x26;token=6a95fb6c-b6c9-471d-9e9d-9e54e3d79cf0" alt=""><figcaption><p>Attention areas guidelines</p></figcaption></figure>