egui Theming: Custom Colors, Rounding & Spacing | Rust GUI Ep 26

1views
00
9:21
T
Taught by Celeste AI - AI Coding Coach
View on YouTube
Description
Build a Theme Editor with live preview of custom dark/light themes, accent colors, rounding, and spacing in egui! Learn Visuals, Style, ctx.set_style(), Rounding, and Color32. Student code: https://github.com/GoCelesteAI/egui_theming_styles/tree/main What You'll Learn: - Visuals::dark() and Visuals::light() for base themes - visuals.selection.bg_fill for custom accent color - ctx.style().clone() to modify the current style - style.spacing.item_spacing for widget spacing - Rounding::same() and corner_radius for rounded widgets - ctx.set_style() to apply changes every frame - Color32::from_rgb() for accent color conversion - color_edit_button_rgb for color picking - SidePanel with theme controls + CentralPanel with live preview - Slider, checkbox, and button widgets responding to theme Timestamps: 0:00 Intro 0:12 App Preview 0:22 What We're Building 0:54 Create Project & Cargo.toml 1:26 main.rs — App Entry Point 2:06 app.rs — MyApp Struct with Theme Fields 2:46 Default Implementation 3:18 impl App — Visuals Dark/Light Toggle 3:52 Custom Accent Color with Color32 4:24 Style Clone, Spacing & Rounding 5:06 ctx.set_style() to Apply Theme 5:32 SidePanel — Theme Controls 6:22 CentralPanel — Preview Widgets 7:02 cargo build & Neo-tree Browse 7:26 App Demo 8:18 Recap 8:58 Next Episode Series: Learn egui in Neovim Part of a 36-episode series teaching Rust GUI development with egui, coded entirely in Neovim with Neo-tree. Tags: egui, rust, gui, theming, styles, visuals, dark mode, custom colors, rounding, spacing, tutorial, neovim, theme editor, set_style

Tags

eguirustguithemingstylesvisualsdark modecustom colorsroundingspacingtutorialneovimtheme editorset_style
Back to tutorials

Duration

9:21

Published

March 17, 2026

Added to Codegiz

March 17, 2026

Open in YouTube