Assets

a. Files

(i) Uploading Files: “Drag and Drop” files or click on “Browse Assets” to add files such as images (JPG, PNG, SVG, etc), Videos, GIFs, etc. (ii) Storage Overview: (Varies based on the Subscription Plan) (iii) Total Space available. (iv) Number of files one can upload. (v) Items in the assets: To add a file from assets to UI, first simply select the container in the canvas and then select the desired file. (vi) To delete the assets, click on the cross icon

b. Figma:

(i) Log in to Figma using your email ID and give access to view the Brokenatom. (ii) Enter Figma file ID or URL inside the assets> Figma>Input. (iii) After providing that, you should see all the frames of that Figma file. (iv) To add the frame design into the html canvas, first select the container and then click on the frame.

c. Alternatively, one can also use the “Figma to brokenatom” plugin.

(i) Run the plugin (ii) Select the frame in the Figma (iii) Generate the code by clicking on the “Generate” button. (iv) Copy the code (v) Paste in the HTML component in the layer section in the Brokenatom.