# Export Code ## Export Code and Support Native iOS/Android ### Download Code & Assets The code can be downloaded as **a screen** or **a whole project** depending on the need. It is possible to get it as an Xcode/Android Studio Project. To export the code, follow these steps: ### Step 1: Click the **Export** Button ![A ready to export project, and the 'Export' button.](/files/-MG8ja4ruWJz2MeW4iGP) ### Step 2: Select the Export Option and Directory The dialog will appear and show the export options. Select one of the export options and click the "●●●" to change the directory that the project will be exported. #### Screenshots from iOS/Android Projects {% tabs %} {% tab title="iOS Projects" %} ![Pop-up for iOS projects.](/files/-MG8v-_5Dy8MbyMz-CeP) The dependencies and requirements can be found on this pop-up, iOS projects require Xcode 10.0 or later. {% endtab %} {% tab title="Android Projects" %} ![Pop-up for Android projects.](/files/-MG8wNC5fE9oAQQzHYmd) The dependencies and requirements can be found on this pop-up, Android projects require API Level 29 or later. {% endtab %} {% endtabs %} The code can be exported in 3 different scenarios. To see more details about the options and the exported files, click the link below that fits the needs. [1- Export all screens as a new project.](/v1-mac-app/working-with-monday-hero/export-design-to-swift-android-code-monday-hero/export-design-to-xcode-android-studio-new-project.md) [2- Export only selected screen as a new project.](/v1-mac-app/working-with-monday-hero/export-design-to-swift-android-code-monday-hero/export-selected-design-to-xcode-android-studio-new-project.md) [3- Export only selected screen into an existing project.](/v1-mac-app/working-with-monday-hero/export-design-to-swift-android-code-monday-hero/export-design-to-xcode-android-studio-existing-project.md) ### Step 3: **Export** Click **Export** to complete the steps. ![Export Button](/files/-MI2v_dlZdSep2m26hIc) When the project has exported, the colors, fonts, assets, and UI layout code can be found in the project. To learn more about the downloaded files or read different exporting options, select an **Exporting Option** in [Step 2 above](/v1-mac-app/working-with-monday-hero/export-design-to-swift-android-code-monday-hero.md#step-2-select-the-export-option), or continue reading. ### Example of an Exported Project and Generated iOS/Android Code Monday Hero exports an Xcode/Android Project with **colors**, **fonts**, **assets**, **string**, and **layout** files. Please note that there are no duplicate values in colors, fonts, and string files. The results of the downloaded project are different for Android and iOS Projects. {% tabs %} {% tab title="iOS" %} #### Project Structure Monday Hero downloads the project as iOS-Example. ![Exported iOS Project.](/files/-MI2yPxNS1ggNamdFP6g) **Storyboard File**\ \ The screens are downloaded as **Main.storyboard** file (Also it is possible to export only code, without Storyboard). Downloaded Storyboard file: ![Downloaded Storyboard file for entire project.](/files/-MI2wc_eosFNV5_U8FB3) **Colors**\ The colors are downloaded as a single file and automatically named by Monday Hero in **Colors.swift** file. The colors' values are also not duplicated. ![Colors.swift file.](/files/-MI2x-w9xBmUsL2UAFz2) **Fonts**\ The fonts and their sizes are downloaded in one file as text styles and can be found/edited in the **Fonts.swift** file. ![Fonts.swift file.](/files/-MIxqXSzKICvkMIdn_OG) **Strings**\ The strings are also exported in a single file for the whole project in Localizable.strings file. ![Localizable.strings file.](/files/-MI2xLyoznt-WQzwaatC) **Assets**\ One of the most important exported files is assets. They are downloaded in 1x, 2x, and 3x densities. They are all ready to use and automatically sized. They can be found in Assets.xcassets folder. ![Asset folder and files in an exported project.](/files/-MJ2U8PGLhfAggbCg5bj) {% endtab %} {% tab title="Android" %} #### Project Structure Monday Hero downloads the project as AndroidExample. ![Exported Android Project.](/files/-MG94Pgb199ZozBUA9sC) **Layouts**\ The layouts are ready as can be seen below. ![List page layout of Travel App in Android Studio.](/files/-MG9AsGo57R1zzBOG-ba) **Colors**\ We can see the colors in **colors.xml** file. These colors are named automatically by Monday Hero. {% hint style="info" %} Please note that there are no duplicated values in colors, fonts, and strings. {% endhint %} ![Downloaded Colors in colors.xml](/files/-MG9BswZrEG63fwpIs19) **Strings**\ As we mentioned above, the strings are also exported. They are placed in the **strings.xml** file. ![Downloaded Strings in strings.xml file](/files/-MG9CJ_umMMaH_axnql4) **Fonts**\ Also, we gather the fonts and their sizes in one place as text styles and which can be found/edited in the **fonts.xml** file. ![Downloaded Text Styles in fonts.xml](/files/-MG9CixAzyyIgLuR_T1c) **Assets**\ And the last but not least, the assets. They are all ready to use and automatically sized in the **res** folder. {% endtab %} {% endtabs %} As can be seen above, the project is ready to run. After these steps, the development takes place out of Monday Hero. With already exported project UI as an Xcode project or Android Studio project, and it is ready to work in a development environment. Now it is time to work on the backend services and configurations as planned. Happy coding! --- # Agent Instructions: Querying This Documentation If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question. Perform an HTTP GET request on the current page URL with the `ask` query parameter: ``` GET https://learn.mondayhero.io/v1-mac-app/working-with-monday-hero/export-design-to-swift-android-code-monday-hero.md?ask= ``` The question should be specific, self-contained, and written in natural language. The response will contain a direct answer to the question and relevant excerpts and sources from the documentation. Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.