Download converted designs

Change layer, asset, and code conversion settings to determine how the project is created. Then download the converted design as a QML project that you can open in Qt Creator or VS Code.

Once you're satisfied with the converted design, you can download the QML files, assets, and custom fonts to your computer. Figma to Qt creates a QML project with a .qmlproject project configuration file for you.

To download converted designs, select (Download) in the plugin.

The plugin Home page.

The plugin analyzes the whole design (except skipped pages and layers) and creates QML code based on the analysis. Therefore, the code will differ somewhat from the code you see while previewing individual layers.

Download font files

Custom font files are taken from the live preview, so you must connect to it and upload the missing fonts. Only fonts that you use in the converted layers are added to the ZIP file, even if you upload more fonts to the live preview. Fonts that are used in images or skipped pages and layers are not downloaded.

Create projects for Qt for MCUs

QML projects for Qt for MCUs differ slightly from standard QML projects.

To download converted designs for Qt for MCUs projects:

1. In the plugin, go to (Settings) > Code.

   

   Code settings on the Settings page in the plugin.

2. Select Use Qt for MCUs compatible types.
3. Select Optimize text rendering to convert text layers into instances of Qt for MCUs StaticText.
4. Select Spark font engine for text rendering for internationalized applications that have complex scripts (such as Arabic, Hindi, or Thai) or bidirectional text or need dynamic text rendering.
5. Select (Download) to generate and download the ZIP file that contains the files, assets, and fonts.

Open the .qmlproject file in Qt Creator for further development.