How to view code in Handoff

Handoff turns your layers into code, giving your developers pixel-perfect values that they can copy and paste into their code editor.

 

How to view code

Code snippets are available whenever an element in the design is selected in Handoff.

Artboard_Copy_3.png

  1. Open your project and click the Play
  2. Click the Handoff button in the bottom left corner
  3. Click on any element in the design
  4. On the right-hand side above the code section, click Copy code
Try it for yourself! Head to this link, hover over any element and click! https://marvelapp.com/243e1g0g/screen/70477024/handoff

 

How to switch to different languages

Handoff defaults to the language supported by the type of project (iPhone, Android, etc) but you can change this at any time.

Handoff supports CSS, Swift, Objective-C and Android XML.

Artboard_Copy.png

  1. Open your project and click the Play
  2. Click the Handoff button in the bottom left corner
  3. Under Format settings click the code dropdown
  4. Select the language you would like to switch to
Was this article helpful?
0 out of 2 found this helpful