Skip to content

egui Adapter

The egui feature maps Opaline themes onto egui's Visuals system, bringing token-based theming to immediate-mode GUI applications.

toml
[dependencies]
opaline = { version = "0.4", features = ["egui"] }

Color Conversion

OpalineColor converts to egui::Color32:

rust
use opaline::OpalineColor;
use egui::Color32;

let color = OpalineColor::new(225, 53, 255);
let egui_color: Color32 = color.into();
// → Color32::from_rgb(225, 53, 255)

Visuals Generation

Convert a full Opaline theme to egui Visuals:

rust
use opaline::adapters::egui::to_egui_visuals;

let theme = opaline::Theme::default();
let visuals = to_egui_visuals(&theme);

// Apply in your egui app
ctx.set_visuals(visuals);

The function starts from Visuals::dark() or Visuals::light() based on the theme variant, then overrides all color properties. Non-color properties (corner radii, shadows, spacing) retain their sensible defaults.

Token → Visuals Mapping

Opaline TokenVisuals Field
bg.basepanel_fill, widgets.noninteractive.bg_fill
bg.panelwindow_fill, widgets.inactive.bg_fill
bg.highlightfaint_bg_color, widgets.hovered.bg_fill
bg.codecode_bg_color
bg.selectionselection.bg_fill, widgets.active.bg_fill
text.primaryoverride_text_color
text.secondarywidgets.inactive.fg_stroke
text.mutedwidgets.noninteractive.fg_stroke
accent.primaryhyperlink_color, selection.stroke, widgets.hovered.fg_stroke
accent.secondarywidgets.open.bg_stroke
border.focusedwidgets.hovered.bg_stroke
border.unfocusedwindow_stroke, widgets.noninteractive.bg_stroke
warningwarn_fg_color
errorerror_fg_color

Widget States

Each widget state uses a different layer of the theme:

Widget StateBackgroundForegroundBorder
Noninteractivebg.basetext.mutedborder.unfocused
Inactivebg.paneltext.secondaryborder.unfocused
Hoveredbg.highlightaccent.primaryborder.focused
Activebg.selectionaccent.primaryaccent.primary
Openbg.highlighttext.primaryaccent.secondary

Runtime Theme Switching

rust
use opaline::adapters::egui::to_egui_visuals;

fn switch_theme(ctx: &egui::Context, theme_name: &str) {
    let theme = opaline::load_by_name(theme_name).expect("valid theme");
    ctx.set_visuals(to_egui_visuals(&theme));
}

All 39 builtin themes work with egui. Dark themes start from Visuals::dark(), light themes from Visuals::light().

Released under the MIT License.