egui — Easy-to-Use Immediate Mode GUI in Pure Rust That Runs Anywhere

What it is

egui is a pure-Rust immediate mode GUI library. Unlike retained mode frameworks where you build a widget tree and the framework manages updates, egui redraws the entire UI every frame. You call functions like ui.button('Click me') and handle the result inline. No widget state management, no callback registration.

egui compiles to native desktop (via eframe), web browsers (via WASM), and embedded targets. It is the Rust ecosystem's answer to Dear ImGui, with a more idiomatic Rust API and first-class WebAssembly support.

How it saves time or tokens

egui's immediate mode API eliminates the complexity of widget lifecycle management. In retained mode frameworks, you create widgets, register callbacks, manage state, and handle updates. In egui, the UI logic is just Rust code that runs every frame. This makes prototyping tools and debug UIs fast.

Cross-platform compilation means one codebase for desktop and web. Write your UI once, compile to native with eframe or to WASM for browser deployment.

How to use

1. Add egui to your Cargo.toml:

[dependencies]
eframe = "0.28"

1. Write your UI:

use eframe::egui;

fn main() -> eframe::Result {
    eframe::run_simple_native(
        "My App",
        eframe::NativeOptions::default(),
        move |ctx, _frame| {
            egui::CentralPanel::default().show(ctx, |ui| {
                ui.heading("Hello egui");
                if ui.button("Click me").clicked() {
                    println!("Button clicked");
                }
            });
        },
    )
}

1. Run with cargo run for native, or compile to WASM with trunk serve for web.

Example

A counter app with slider and label:

use eframe::egui;

struct MyApp {
    counter: i32,
    speed: f32,
}

impl eframe::App for MyApp {
    fn update(&mut self, ctx: &egui::Context, _frame: &mut eframe::Frame) {
        egui::CentralPanel::default().show(ctx, |ui| {
            ui.heading(format!("Counter: {}", self.counter));
            if ui.button("+1").clicked() {
                self.counter += 1;
            }
            ui.add(egui::Slider::new(&mut self.speed, 0.0..=10.0).text("Speed"));
        });
    }
}

No widget IDs, no event handlers, no state synchronization. The UI is a function of your data.

Related on TokRepo

• AI tools for coding -- Development tools and frameworks for building applications
• Featured workflows -- Discover popular developer tools and configurations

Common pitfalls

• Expecting retained mode patterns. egui redraws every frame. Do not cache widget references or register callbacks. Instead, put your UI logic in the update function and let egui handle rendering.
• Performance on complex UIs. Immediate mode redraws everything each frame. For UIs with thousands of widgets, use egui's built-in ScrollArea with lazy rendering or profile with puffin.
• WASM bundle size. A minimal egui WASM app is around 2MB. Use wasm-opt and trunk optimizations to reduce this for production web deployments.