Technical Guide: Generating macOS App Icons with MōIcons

Overview of MōIcons

MōIcons is a desktop application designed to streamline the creation of macOS app icons in the *.icns format. By leveraging the OpenAI API, the tool allows users to generate high-quality, platform-compliant icons through text-based prompts. The application is specifically engineered to adhere to macOS design standards, ensuring that generated assets feature centered subjects, appropriate composition for squircle masks, and the exclusion of text. This approach helps developers maintain a consistent visual language across their applications while automating the technical complexities of icon asset generation.

Prerequisites and System Requirements

To successfully operate or build the MōIcons application, your environment must meet specific technical requirements. The software is compatible with macOS 14 (Apple Silicon) or later. Development and build processes require Node.js version 24.14.1 (LTS) or later. Additionally, the application relies on the MōBrowser environment, specifically version 2.13.0 or later. Users intending to build the application from source should be aware that production Sentry telemetry is only included if the SENTRY_DSN environment variable is defined during the build process, typically handled via GitHub Actions secrets for release builds.

Setup and Development Environment

The project repository provides standard commands for initializing the development environment. After cloning the repository, users should navigate to the project directory and execute the installation command to resolve dependencies. The following command is used to install the necessary packages:

npm install

Once dependencies are installed, developers can run the application in development mode using npm run dev. For scenarios where local UI testing is required without invoking the OpenAI API, the project supports a mock mode via npm run dev:mock. To generate a production-ready build, the npm run build command is utilized, which compiles the source code located in the src/main/ and src/renderer/ directories.

The Icon Generation Workflow

The workflow for creating an icon is iterative and prompt-driven. Users begin by entering a descriptive phrase into the prompt field, such as "blue clipboard with folded corner." Optionally, a reference image in PNG format can be attached to guide the model's output, which is particularly useful for maintaining consistency with existing logos or sketches. Upon pressing Generate or Enter, the application returns three distinct variants. Users can then select a preferred variant to enter the refine mode. In this mode, the selected icon serves as a reference for subsequent generations, allowing for incremental adjustments until the desired result is achieved.

Exporting and Asset Management

Once the user is satisfied with the generated icon, the application facilitates a straightforward export process. Clicking the Save button prompts the user to select a destination path. The application then writes both a *.icns bundle and a *.iconset folder containing all standard macOS icon sizes to the chosen location. A key technical advantage of this export method is that the *.icns file utilizes full-bleed artwork. This allows the macOS operating system to apply its own native squircle mask, preventing the visual artifacts—such as gray plates or shrunken icons—that often occur when icons are pre-clipped with hard corners.

Project Architecture and Technical Details

The MōIcons codebase is organized into two primary directories. The src/main/ directory contains the core logic, including window management, Inter-Process Communication (IPC), prompt construction, provider selection, and the assembly of the final *.icns files. The src/renderer/ directory houses the React-based user interface, which includes the squircle preview functionality and the management of the generation pipeline state. This separation of concerns ensures that the UI remains responsive while the main process handles the heavier tasks of image generation and file system operations.

Limitations and Usage Considerations

While MōIcons simplifies the creation of macOS icons, users should be aware of its operational constraints. The application is strictly a desktop tool for macOS and requires an active connection to the OpenAI API for image generation. It is not intended for general-purpose image editing; its primary value lies in its adherence to macOS-specific design constraints and the automated generation of the *.icns bundle. Users should also note that quitting the application with an unsaved icon will trigger a confirmation dialog to prevent accidental data loss. For further information, users can visit the official repository at https://github.com/TeamDev-IP/MoBrowser-App-Icon-Maker.

Target Audience

This tool is primarily intended for macOS developers and designers who need to generate high-quality, platform-compliant app icons efficiently. It is particularly well-suited for those who prefer a prompt-based workflow over manual design in vector software. By automating the creation of the *.iconset folder and the *.icns bundle, MōIcons reduces the manual effort required to prepare assets for distribution. It is an ideal solution for teams or individuals who require rapid prototyping of icon concepts while ensuring that the final output meets the technical specifications required by the macOS operating system.