Introduction

Rust Heroicons is a Rust port of Heroicons.

Heroicons is a set of free MIT-licensed high-quality SVG icons for UI development.

Frameworks

Rust Heroicons is available for the following frameworks:

License

This project is available under the MIT license.

Rust For Web

The Rust Heroicons project is part of Rust For Web.

Rust For Web creates and ports web UI libraries for Rust. All projects are free and open source.

Frameworks

Heroicons Dioxus

Implementation of the Heroicons icon library for Dioxus applications.

Installation

cargo add heroicons-dioxus

Usage

use dioxus::prelude::*;
use heroicons_dioxus::Camera;

#[component]
fn App() -> Element {
    rsx! {
        Camera {
            color: "red",
            size: 48,
        }
    }
}

Props

Name	Type	Default
`size`	`usize`	`24`
`color`	`String`	`"currentColor"`
`fill`	`String`	`"none"`
`stroke_width`	`usize`	`2`
`absolute_stroke_width`	`bool`	`false`

Icons

use dioxus::prelude::*;
#[component]
pub fn Icons() -> Element {
    rsx! {
        div { class: "w-full max-w-80 py-4" }
    }
}

Heroicons Leptos

Implementation of the Heroicons icon library for Leptos applications.

Installation

Install the icons from your command line.

cargo add heroicons-leptos

Usage

use leptos::prelude::*;
use heroicons_leptos::Camera;

#[component]
fn App() -> impl IntoView {
    view! {
        <Camera color="red" size=48 />
    }
}

Props

Name	Type	Default
`size`	`Signal<usize>`	`24`
`color`	`Signal<String>`	`"currentColor"`
`fill`	`Signal<String>`	`"none"`
`stroke_width`	`Signal<usize>`	`2`
`absolute_stroke_width`	`Signal<bool>`	`false`

Icons

use leptos::prelude::*;
#[component]
pub fn Icons() -> impl IntoView {
    view! {
        <div class="w-full max-w-80 py-4">
        </div>
    }
}

Heroicons Yew

Implementation of the Heroicons icon library for Yew applications.

Installation

Install the icons from your command line.

cargo add heroicons-yew

Usage

use heroicons_yew::Camera;
use yew::prelude::*;

#[component]
fn App() -> Html {
    html! {
        <Camera color="red" size=48 />
    }
}

Props

Name	Type	Default
`size`	`usize`	`24`
`color`	`String`	`"currentColor"`
`fill`	`String`	`"none"`
`stroke_width`	`usize`	`2`
`absolute_stroke_width`	`bool`	`false`

Icons

use yew::prelude::*;
#[function_component]
pub fn Icons() -> Html {
    html! {
        <div class="w-full max-w-80 py-4">
        </div>
    }
}