Skip to main content

Access project settings

The Design System section in the left sidebar with the Configure code export gear icon highlighted
  1. Open your project in the editor
  2. In the left sidebar, find the Design System section
  3. Click the Configure code export icon next to Design System
The Code export settings dialog opens.
The Code export settings dialog showing import alias and icon import options

Import alias

Set the path prefix used for component imports in generated code. Default: @/ui/components This determines how import statements appear in your exported code:
Change this to match your project’s directory structure and TypeScript path aliases.

Icon imports

Choose how icons are imported in generated code.

Import as component

Icons are imported as React components:

Import as string

Icons are referenced by name as strings:
If your project has uploaded custom icons, you must use “Import as component”. The string option is disabled when custom icons are present.
Last modified on August 31, 2026