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 | - |
*not all icons included in gallery.
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
[dependencies]
yew_icons = {version = "0.7", features = ["LucideArrowLeftCircle", "LucideArrowRightCircle", "LucideArrowUpCircle"]}
Then, add an <Icon>
component with the corresponding icon id, optionally specifying a width
, height
, and/or onclick
callback.
use yew::prelude::*;
use yew_icons::{Icon, IconId};
html!{
<>
<Icon icon_id={IconId::LucideArrowLeftCircle}/>
<Icon icon_id={IconId::LucideArrowUpCircle} width={"2em".to_owned()} height={"2em".to_owned()}/>
<Icon icon_id={IconId::LucideArrowRightCircle} onclick={Callback::from(|_: MouseEvent| {})}/>
</>
}
Note: The icons will inherit their parent's CSS color
.
Each icon collection must be included with the corresponding feature flag, such as lucide
or font_awesome_solid
.
To save binary size, individual icons can also be included by feature flag, such as LucideZoomIn
or FontAwesomeSolidAtom
.
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 rustwasm/wasm-pack#981).
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>
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.
# 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
# 1. uncomment the "testing" feature flag in Cargo.toml
# 2. for each icon set to test, run:
cargo test test --features "enum-iterator testing [icon collection to test]"
# (the test name is "test", which we specify to skip the doc tests)
# icon collection options are: bootstrap feather font_awesome_regular font_awesome_solid heroicons_mini_solid heroicons_outline heroicons_solid lipis_flag_icons_1_x_1 lipis_flag_icons_4_x_3 lucide octicons simple_icons
# if testing all icon sets at once, the prokio-runtime-worker may overflow its stack