Crate lucide_slint 

Lucide Slint

Implementation of the lucide icon library for Slint.

Installation

In an existing Slint project, run the following command to add lucide-slint as a build dependency:

cargo add lucide-slint --build

Add the following to your build.rs file to import lucide-slint as a Slint library:

use std::{collections::HashMap, path::PathBuf};
 
fn main() {
    let library = HashMap::from([(
        "lucide".to_string(),
        PathBuf::from(lucide_slint::get_slint_file_path().to_string()),
    )]);
    let config = slint_build::CompilerConfiguration::new().with_library_paths(library);
 
    // Specify your Slint code entry here
    slint_build::compile_with_config("ui/main.slint", config).expect("Slint build failed");
}

Usage

Then you can use lucide icons in your Slint files like this:

import { PlayIcon } from "@lucide";
 
export component App inherits Window {
    VerticalBox {
        PlayIcon {
            size: 24px;
            colorize: #fff;
        }
    }
}

The Icon component inherits an Image element, so you can set properties like vertical-tiling, width, etc.

import { FlowerIcon } from "@lucide";
 
FlowerIcon {
    size: 36px;
    width: 100%;
    height: 100%;
    opacity: 0.7;
    vertical-tiling: round;
    horizontal-tiling: round;
}

Or if you just want to use the raw image data, you can access the icon via Icons:

import { Icons } from "@lucide";
 
Button {
    text: "Back";
    icon: Icons.ArrowLeftIcon;
    colorize-icon: true;
}
 
// equivalent to
Button {
    text: "Back";
    icon: @image-url("icons/arrow-left.svg"); // The path is actually relative to the lucide-slint package, use `Icons.ArrowLeftIcon` instead.
    colorize-icon: true;
}

Available Icons

For a complete list of available icons, visit the Lucide Icons website.

To use an icon in Slint:

1. Find your desired icon (e.g., a-arrow-down)
2. Click Copy Component Name to get the PascalCase name (e.g., AArrowDown)
3. Append Icon to the component name: AArrowDownIcon

Example:

import { AArrowDownIcon } from "@lucide";
 
AArrowDownIcon { }

Functions

get_slint_file_path

Returns the file path to the lib.slint file included in this crate.