Keyboard shortcuts

Press or to navigate between chapters

Press S or / to search in the book

Press ? to show this help

Press Esc to hide this help

Android - Import WEBP assets into multiple feature modules

This guide demonstrates how to configure figx to export illustrations from Figma as WEBP images into Android drawable-* directories, including dark theme variants using a naming convention. Unlike basic implementations, this solution supports multi-module applications where assets need to be distributed across different feature modules.

Project structure

Two feature modules — feature/settings and feature/update:

.
├── app/
│   └── build.gradle
├── feature/
│   ├── settings/
│   │   ├── src/main/res/
│   │   ├── .fig.toml
│   │   └── build.gradle
│   └── update/
│       ├── src/main/res/
│       ├── .fig.toml
│       └── build.gradle
├── .figtree.toml
├── settings.gradle
└── build.gradle

Workspace config

# .figtree.toml
[remotes.illustrations]
file_key = "..."
container_node_ids = ["..."]

[illustrations]
extends = "android-webp"
remote = "illustrations"
# Export only the required density scales
scales = ["xhdpi"]
# Dark theme support configuration
# Defines the naming pattern for dark theme variants
# {base} will be replaced with the base asset name
# Leave unset to disable dark theme support
# For example, if you have an asset named "Ill / Welcome" in Figma,
# figx will also look for "Ill / Welcome / Dark" when night mode is enabled
night = "{base} / Dark"
# Losless quality by default (recommended)
quality = 100

FigX automatically looks for Figma nodes like Ills / User / Dark when the night naming pattern is defined.

Each module in your workspace can define its own .fig.toml to select specific assets and optionally override settings from the workspace-level .figtree.toml profile.

Fig-file configurations

# feature/settings/.fig.toml
[illustrations]
# <resource name in project> = <Figma node name>
ill_user = "Ills / User"
# feature/update/.fig.toml
[illustrations]
# Override any field from parent profile
ill_outdated = { name = "Ills / Outdated", quality = 75 }

You can override individual fields from the parent profile per asset using inline tables. In the example above, the export quality for ill_outdated is lowered to 75.

Run

figx import //...

Note: The //... pattern recursively imports all modules with .fig.toml configs found in the workspace.

Result

.
├── app/
│   └── build.gradle
├── feature/
│   ├── settings/
│   │   ├── src/main/res/
│   │   │   ├── drawable-xhdpi/
│   │   │   │   └── ill_user.webp
│   │   │   └── drawable-night-xhdpi/
│   │   │       └── ill_user.webp
│   │   ├── .fig.toml
│   │   └── build.gradle
│   └── update/
│       ├── src/main/res/
│       │   ├── drawable-xhdpi/
│       │   │   └── ill_outdated.webp
│       │   └── drawable-night-xhdpi/
│       │       └── ill_outdated.webp
│       ├── .fig.toml
│       └── build.gradle
├── .figtree.toml
├── settings.gradle
└── build.gradle