yew_icons

This crate makes it easy to use SVG icons from the following collections (more may be added in the future):

Icon Set	License	Variants
Bootstrap	MIT License	-
Feather	MIT License	Deprecated (use Lucide)
Font Awesome	CC BY 4.0 License	Regular, Solid
Heroicons	MIT License	Solid, Outline, Mini Solid
Lipis Flag Icons	MIT License	-
Lucide	ISC License	-
Octicons	MIT License	-
Simple Icons	CC0 License	-
Extra	Case-by-case	-

Gallery

*not all icons included in gallery.

Usage

Use the gallery to find icons you like, and add them as feature flags.

# If still using yew 0.19, use yew_icons 0.6.1
# If still using yew 0.20, use yew_icons 0.7.3
# If still using yew 0.21, use yew_icons 0.8.0
# If still using yew 0.22, use yew_icons 0.9.0

[dependencies]
yew_icons = {version = "0.10", features = ["lucide"]}

Then, add an <Icon> component with the corresponding icon data, optionally specifying a width, height, and/or onclick callback.

use yew::prelude::*;
use yew_icons::{Icon, IconData};

let _ = html!{
    <>
        <Icon data={IconData::LUCIDE_ARROW_LEFT_CIRCLE}/>
        <Icon data={IconData::LUCIDE_ARROW_UP_CIRCLE} width={"2em".to_owned()} height={"2em".to_owned()}/>
        <Icon data={IconData::LUCIDE_ARROW_RIGHT_CIRCLE} onclick={Callback::from(|_: MouseEvent| {})}/>
    </>
};

example image

Note: The icons will inherit their parent's CSS color.

0.9.0 breaking change

To comply with the new feature flag limit, yew_icons no longer uses a feature per IconId enum variant. Instead, use features to enable collections and then use associated constants of IconData.

Feature Flags

Each icon collection must be included with the corresponding feature flag, such as lucide or font_awesome_solid.

By default, no collections or icons are included. Be warned that including too many icons may result in a .wasm binary that some WebAssembly engines refuse to load, especially in debug mode (see https://github.com/rustwasm/wasm-pack/issues/981).

License

Code is licensed under either of

Apache License, Version 2.0 (LICENSE-APACHE or http://www.apache.org/licenses/LICENSE-2.0)
MIT license (LICENSE-MIT or http://opensource.org/licenses/MIT)

at your option.

Icons are licensed by their respective creators (see above). An license summary is emitted to the DOM for each icon:

<svg data-license="...original license..."></svg>

Contribution

Unless you explicitly state otherwise, any contribution intentionally submitted for inclusion in the work by you, as defined in the Apache-2.0 license, shall be dual licensed as above, without any additional terms or conditions.

Updating an Icon Collection

# 1. on first checkout, init submodules:
git submodule update --init --recursive

# 2. update a submodule to latest commit in remote branch:
git submodule update --remote bootstrap

# 3. generate the icons, writing the feature flags to a file:
cargo run --features="generator" > generated_feature_flags.txt

# 4. reformat the feature flags onto separate lines (choose your own adventure, e.g. vim macros)

# 5. copy the feature flags from generated_feature_flags.txt to the Cargo.toml

PR's ideally shouldn't include non-trivial amounts of generated file diffs. Merging and then generating is much easier to review than thousands of generated files.

yew_icons 0.10.0