https://github.com/dioxuslabs/dioxus-icons
https://github.com/dioxuslabs/dioxus-icons
Last synced: 12 days ago
JSON representation
- Host: GitHub
- URL: https://github.com/dioxuslabs/dioxus-icons
- Owner: DioxusLabs
- License: mit
- Created: 2026-05-07T16:39:55.000Z (about 1 month ago)
- Default Branch: main
- Last Pushed: 2026-05-08T00:32:49.000Z (about 1 month ago)
- Last Synced: 2026-05-08T01:30:21.545Z (about 1 month ago)
- Language: Rust
- Size: 5.81 MB
- Stars: 0
- Watchers: 0
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
- Agents: AGENTS.md
Awesome Lists containing this project
README
dioxus-icons
Dioxus components for every Lucide icon.
---
The full Lucide set — 1,700+ icons — exposed as Dioxus components. Each icon is its own component, so the linker keeps only the ones you import.
## Quick start
```toml
[dependencies]
dioxus-icons = "0.1"
```
```rust
use dioxus::prelude::*;
use dioxus_icons::lucide::Trash;
#[component]
fn DeleteButton() -> Element {
rsx! {
button {
Trash { size: 16 }
"Delete"
}
}
}
```
Every icon lives under [`dioxus_icons::lucide`] and accepts the shared [`IconProps`].
## Customization
`IconProps` keeps a `size` convenience prop and extends Dioxus SVG attributes on the root SVG.
| prop / attr | default | maps to |
|---|---|---|
| `size` | `24` | SVG `width` / `height` when those attrs are not set; accepts numbers or CSS lengths |
| `stroke` | `"currentColor"` | SVG `stroke` |
| `fill` | `"none"` | SVG `fill` |
| `stroke_width` | `2` | SVG `stroke-width` |
| `stroke_linecap` | `"round"` | SVG `stroke-linecap` |
| `stroke_linejoin` | `"round"` | SVG `stroke-linejoin` |
| SVG attrs | inherited | root SVG attributes |
```rust
# use dioxus::prelude::*;
use dioxus_icons::lucide::Bell;
# let _ = rsx! {
Bell { size: 20, stroke: "red", stroke_width: 3 }
# };
```
Because `stroke` defaults to `currentColor`, icons inherit the surrounding text color — so Tailwind's `text-*` utilities (or any CSS framework) work out of the box on either the icon or its parent:
```rust
# use dioxus::prelude::*;
use dioxus_icons::lucide::{Bell, Menu};
# let _ = rsx! {
nav { class: "flex items-center gap-3 text-slate-900",
Menu { size: 20 }
Bell { size: 18, class: "text-amber-600" }
}
# };
```
## Dioxus compatibility
Targets the Dioxus `0.7.x` line starting at `0.7.7`. Pick your renderer features (`web`, `desktop`, `mobile`, `server`, `fullstack`) in your application crate.
## Examples
Examples live under [`crates/dioxus-icons/examples`](https://github.com/dioxuslabs/dioxus-icons/tree/main/crates/dioxus-icons/examples):
```sh
cargo run -p dioxus-icons --example basic
cargo run -p dioxus-icons --example navbar
cargo run -p dioxus-icons --example tailwind
cargo run -p dioxus-icons --example stateful_button
```
## License
Crate code is MIT (`LICENSE`). Generated icon data comes from Lucide and is covered by `LICENSE-LUCIDE` (upstream ISC plus the Feather-derived MIT notice). The published crate is `MIT AND ISC`.
[`dioxus_icons::lucide`]: https://docs.rs/dioxus-icons/latest/dioxus_icons/lucide/index.html
[`IconProps`]: https://docs.rs/dioxus-icons/latest/dioxus_icons/struct.IconProps.html