|
| 1 | +[](https://discord.gg/sKJSVNSCDJ) |
| 2 | +[](https://crates.io/crates/dioxus-free-icons) |
| 3 | + |
| 4 | +# dioxus-free-icons 🙂 |
| 5 | + |
| 6 | +Use free svg icons in your [Dioxus](https://dioxuslabs.com/) projects easily with dioxus-free-icons. |
| 7 | + |
| 8 | +More information about this crate can be found in the [crate documentation](https://docs.rs/dioxus-free-icons/0.7.0/dioxus_free_icons/). |
| 9 | + |
| 10 | +## Install |
| 11 | + |
| 12 | +To use `dioxus-free-icons`, add this to your Cargo.toml: |
| 13 | + |
| 14 | +```toml |
| 15 | +[dependencies] |
| 16 | +dioxus-free-icons = { version = "0.8", features = ["font-awesome-brands"] } |
| 17 | +``` |
| 18 | + |
| 19 | +### Support features |
| 20 | + |
| 21 | +The following features are available. Please see [react-icons site](https://react-icons.github.io/react-icons) to check the icon name and icon design. |
| 22 | + |
| 23 | +- [bootstrap](https://docs.rs/dioxus-free-icons/0.7.0/dioxus_free_icons/icons/bs_icons/index.html) |
| 24 | +- [font-awesome-brands](https://docs.rs/dioxus-free-icons/0.7.0/dioxus_free_icons/icons/fa_brands_icons/index.html) |
| 25 | +- [font-awesome-regular](https://docs.rs/dioxus-free-icons/0.7.0/dioxus_free_icons/icons/fa_regular_icons/index.html) |
| 26 | +- [font-awesome-solid](https://docs.rs/dioxus-free-icons/0.7.0/dioxus_free_icons/icons/fa_solid_icons/index.html) |
| 27 | +- [feather](https://docs.rs/dioxus-free-icons/0.7.0/dioxus_free_icons/icons/fi_icons/index.html) |
| 28 | +- [octicons](https://docs.rs/dioxus-free-icons/0.7.0/dioxus_free_icons/icons/go_icons/index.html) |
| 29 | +- [hero-icons-outline](https://docs.rs/dioxus-free-icons/0.7.0/dioxus_free_icons/icons/hi_outline_icons/index.html) |
| 30 | +- [hero-icons-solid](https://docs.rs/dioxus-free-icons/0.7.0/dioxus_free_icons/icons/hi_solid_icons/index.html) |
| 31 | +- [ionicons](https://docs.rs/dioxus-free-icons/0.7.0/dioxus_free_icons/icons/io_icons/index.html) |
| 32 | +- [material-design-icons-action](https://docs.rs/dioxus-free-icons/0.7.0/dioxus_free_icons/icons/md_action_icons/index.html) |
| 33 | +- [material-design-icons-alert](https://docs.rs/dioxus-free-icons/0.7.0/dioxus_free_icons/icons/md_alert_icons/index.html) |
| 34 | +- [material-design-icons-av](https://docs.rs/dioxus-free-icons/0.7.0/dioxus_free_icons/icons/md_av_icons/index.html) |
| 35 | +- [material-design-icons-communication](https://docs.rs/dioxus-free-icons/0.7.0/dioxus_free_icons/icons/md_communication_icons/index.html) |
| 36 | +- [material-design-icons-content](https://docs.rs/dioxus-free-icons/0.7.0/dioxus_free_icons/icons/md_content_icons/index.html) |
| 37 | +- [material-design-icons-device](https://docs.rs/dioxus-free-icons/0.7.0/dioxus_free_icons/icons/io_icons/index.html) |
| 38 | +- [material-design-icons-editor](https://docs.rs/dioxus-free-icons/0.7.0/dioxus_free_icons/icons/md_editor_icons/index.html) |
| 39 | +- [material-design-icons-file](https://docs.rs/dioxus-free-icons/0.7.0/dioxus_free_icons/icons/md_file_icons/index.html) |
| 40 | +- [material-design-icons-hardware](https://docs.rs/dioxus-free-icons/0.7.0/dioxus_free_icons/icons/md_hardware_icons/index.html) |
| 41 | +- [material-design-icons-home](https://docs.rs/dioxus-free-icons/0.7.0/dioxus_free_icons/icons/md_home_icons/index.html) |
| 42 | +- [material-design-icons-image](https://docs.rs/dioxus-free-icons/0.7.0/dioxus_free_icons/icons/md_image_icons/index.html) |
| 43 | +- [material-design-icons-maps](https://docs.rs/dioxus-free-icons/0.7.0/dioxus_free_icons/icons/md_maps_icons/index.html) |
| 44 | +- [material-design-icons-navigation](https://docs.rs/dioxus-free-icons/0.7.0/dioxus_free_icons/icons/md_navigation_icons/index.html) |
| 45 | +- [material-design-icons-notification](https://docs.rs/dioxus-free-icons/0.7.0/dioxus_free_icons/icons/md_notification_icons/index.html) |
| 46 | +- [material-design-icons-places](https://docs.rs/dioxus-free-icons/0.7.0/dioxus_free_icons/icons/md_places_icons/index.html) |
| 47 | +- [material-design-icons-social](https://docs.rs/dioxus-free-icons/0.7.0/dioxus_free_icons/icons/md_social_icons/index.html) |
| 48 | +- [material-design-icons-toggle](https://docs.rs/dioxus-free-icons/0.7.0/dioxus_free_icons/icons/md_toggle_icons/index.html) |
| 49 | + |
| 50 | +## Example |
| 51 | + |
| 52 | +This library provides Icon component, which will generate SVG for a Font Awesome icon. |
| 53 | + |
| 54 | +```rust |
| 55 | +use dioxus::prelude::*; |
| 56 | +use dioxus_free_icons::icons::fa_brands_icons::FaRust; |
| 57 | +use dioxus_free_icons::Icon; |
| 58 | + |
| 59 | +fn RustIcon() -> Element { |
| 60 | + rsx!( |
| 61 | + Icon { |
| 62 | + width: 30, |
| 63 | + height: 30, |
| 64 | + fill: "black", |
| 65 | + icon: FaRust, |
| 66 | + } |
| 67 | + ) |
| 68 | +} |
| 69 | +``` |
| 70 | + |
| 71 | +## License |
| 72 | + |
| 73 | +This project is licensed under the MIT license. |
| 74 | + |
| 75 | +### Icon |
| 76 | + |
| 77 | +Icon Library|License|Version |
| 78 | +---|---|--- |
| 79 | +[Bootstrap Icons](https://icons.getbootstrap.com/)|[MIT License](https://github.com/twbs/icons/blob/main/LICENSE.md)| [1.8.3](https://github.com/twbs/icons/tree/v1.8.3) |
| 80 | +[Feather](https://feathericons.com/)|[MIT License](https://github.com/feathericons/feather/blob/master/LICENSE)| [4.29.0](https://github.com/feathericons/feather/tree/v4.29.0) |
| 81 | +[Font Awesome](https://fontawesome.com/)|[CC BY 4.0 License](https://creativecommons.org/licenses/by/4.0/)| [6.1.1](https://github.com/FortAwesome/Font-Awesome/tree/6.1.1) |
| 82 | +[Heroicons](https://heroicons.com/)|[MIT License](https://github.com/tailwindlabs/heroicons/blob/master/LICENSE)| [1.0.6](https://github.com/tailwindlabs/heroicons/tree/v1.0.6) |
| 83 | +[Ionicons](https://ionic.io/ionicons)|[MIT License](https://github.com/ionic-team/ionicons/blob/main/LICENSE)| [6.0.2](https://github.com/ionic-team/ionicons/tree/v6.0.2) |
| 84 | +[Material Design icons](https://developers.google.com/fonts/docs/material_icons)|[Apache License 2.0](https://github.com/google/material-design-icons/blob/master/LICENSE)| [4.0.0](https://github.com/google/material-design-icons/tree/4.0.0) |
| 85 | +[Octicons](https://primer.style/octicons/)|[MIT License](https://github.com/primer/octicons/blob/main/LICENSE)| [17.3.0](https://github.com/primer/octicons/tree/v17.3.0) |
| 86 | + |
| 87 | +## Contribution |
| 88 | + |
| 89 | +The project welcomes all contributions from anyone willing to work in good faith with other contributors and the community. |
| 90 | +In particular, contributions regarding support for other free icons such as Material Design icons or Ionicons are welcome. |
| 91 | +This library aims to be a react-icons-like library for dioxus projects. |
| 92 | + |
| 93 | +### Development |
| 94 | + |
| 95 | +```sh |
| 96 | +// generate icon files |
| 97 | +cd packages/codegen |
| 98 | +cargo run |
| 99 | +``` |
| 100 | + |
| 101 | +### Preview |
| 102 | + |
| 103 | +```sh |
| 104 | +cd packages/exmaple |
| 105 | +cargo install dioxus-cli |
| 106 | +dx serve |
| 107 | +``` |
| 108 | + |
| 109 | +### Update icons |
| 110 | + |
| 111 | +1. checkout a new tag in the icon resource submodule |
| 112 | +2. create new icon files |
| 113 | +3. Update README.md and check the LICENSE |
0 commit comments