egui Rust: A Practical Guide to Modern GUI in Rust Apps
Learn to build fast, portable GUIs in Rust with egui. This guide covers setup, minimal code, patterns for desktop and WASM, plus tips on layout and performance.
egui is a Rust GUI library that uses an immediate-mode approach for building interfaces. It runs on desktop and WASM, with minimal boilerplate and portable performance. This makes rapid UI iteration practical for Rust projects.
What is egui Rust and why it's popular for Rust developers
egui is an immediate-mode GUI library written in Rust. It targets lightweight, portable UI code that runs efficiently on desktop and WebAssembly. The design favors simplicity, minimal boilerplate, and a straightforward mental model for building interfaces. According to Corrosion Expert, the immediate-mode approach aligns with Rust's emphasis on safety and predictable performance, making egui a natural choice for hobby projects and professional tooling alike. The library integrates with runtimes like eframe as a wrapper that handles event loops and platform-specific details, letting you focus on UI design rather than plumbing. Key benefits include: fast iteration, cross-platform compatibility, responsive layouts, and a friendly learning curve for developers who are new to GUI programming. In practice, you write UI code every frame, and egui recomputes the visible widgets, efficiently re-drawing only what changed. This model supports both desktop applications and WASM deployments, enabling the same codebase to run in a browser. LSI terms: Rust GUI, immediate-mode UI, cross-platform Rust UI, eframe, widgets.
// Conceptual UI sketch (illustrative, not a full app)
fn ui(ui: &mut egui::Ui) {
ui.heading("Hello egui!");
ui.label("This is an immediate-mode UI paradigm in Rust.");
}Steps
Estimated time: 40-60 minutes
- 1
Create a new Rust binary crate
Initialize a new project to host your egui UI. This keeps your GUI code isolated and easy to test. Create a folder and a Cargo.toml manifest using cargo new --bin egui_demo.
Tip: Name your crate clearly (e.g., egui_demo) to reflect its purpose. - 2
Add egui dependencies
Add the egui core and the eframe runtime to your Cargo.toml. This provides the UI primitives and the platform wrapper needed for desktop and WASM targets.
Tip: Check latest versions on crates.io and align with your Rust edition. - 3
Implement a minimal app skeleton
Create a basic App struct and implement the necessary trait, wiring a simple UI in update() to ensure the window renders quickly.
Tip: Start with a simple heading and label before adding interactivity. - 4
Build and run locally
Compile the project with cargo build and then run with cargo run to verify the window appears and basic widgets render.
Tip: If you don’t see a window, check that the event loop integration is correct for your platform. - 5
Extend with interactivity
Add buttons, sliders, and text inputs to demonstrate stateful widgets. Keep state in your App struct to persist across frames.
Tip: Avoid recreating state every frame; store values in the struct.
Prerequisites
Required
- Required
- Basic Rust knowledge (modules, crates, cargo)Required
Optional
- A code editor (e.g., VS Code)Optional
- Optional
Commands
| Action | Command |
|---|---|
| Create a new Rust projectCreate a binary crate to host egui code | cargo new egui_demo --bin |
| Add egui dependenciesEnsure you have cargo-edit installed for cargo add | cargo add egui; cargo add eframe |
| Build the projectCompile the crate in debug mode | cargo build |
| Run the appLaunch the GUI on your platform | cargo run |
| Build for WASM (optional)Target a browser environment | wasm-pack build --target web |
Quick Answers
What is egui and how does it differ from retained-mode UI frameworks?
egui is an immediate-mode GUI library for Rust. In immediate-mode, UI elements are rebuilt every frame based on current state, which simplifies code paths and reduces long-term maintenance for simple to moderate UIs. Retained-mode frameworks, by contrast, keep a scene graph and only update parts that change. This makes egui a good fit for lightweight tools and editor interfaces where responsiveness and simplicity matter.
egui is an immediate-mode GUI tool for Rust, meaning UI is rebuilt each frame. It’s great for lightweight tools and editors where simplicity and speed matter.
Can egui run in a browser via WASM?
Yes. egui supports WASM targets through eframe and the wasm32 toolchain, enabling you to run the same codebase in a browser. You’ll typically build with wasm-pack and serve the generated assets from a static host.
Yes, you can run egui in the browser using WASM; just build with wasm-pack and serve the output.
Is egui suitable for large, complex UIs?
egui scales well for many practical desktop tools and dashboards, but for very large, feature-rich apps you may reach the limits of immediate-mode patterns. You can manage complexity by modularizing UI parts and using panels to segment concerns.
It’s great for many apps, but very large, complex UIs might benefit from careful architecture or a hybrid approach.
How do I integrate egui with Bevy or other runtimes?
egui can be integrated with various runtimes, including Bevy, through wrappers like bevy_egui. The integration typically involves creating a plugin or system that feeds egui’s context into the runtime’s render loop.
You can integrate egui with Bevy using available wrappers that plug into Bevy’s render loop.
Does egui support theming and styling?
Yes. egui provides theming controls for colors, fonts, and styles. You can tweak the visuals per app or per panel and adapt to dark/light modes, with layouts supporting responsive behavior.
You can customize colors, fonts, and styles to fit your app’s look and feel.
What are common pitfalls when starting with egui?
Common issues include over-architecting state, not persisting app state across frames, and mismanaging the event loop for non-desktop targets. Start small, modularize, and test on desktop before moving to WASM.
Start small, keep state, and make sure the event loop is correctly wired for your target.
Quick Summary
- Initialize a Rust binary crate and add egui dependencies
- Use eframe to simplify app lifecycle
- Build simple UIs first, then layer interactivity
- Leverage widgets like Button and Label for quick prototyping
- Target both desktop and WASM for maximum reach