Theme

All components support theming through the built-in Theme system, the ActiveTheme trait provides access to the current theme colors:

use gpui_component::{ActiveTheme as _};

// Access theme colors in your components
cx.theme().primary
cx.theme().background
cx.theme().foreground

So if you want use the colors from the current theme, you should keep your component or view have App context.

Theme Registry

There have more than 20 built-in themes available in themes folder.

https://github.com/longbridge/gpui-component/tree/main/themes

And we have a ThemeRegistry to help us to load themes.

use std::path::PathBuf;
use gpui::{App, SharedString};
use gpui_component::{Theme, ThemeRegistry};

pub fn init(cx: &mut App) {
    let theme_name = "Ayu Light";
    // Load and watch themes from ./themes directory
    if let Err(err) = ThemeRegistry::watch_dir(PathBuf::from("./themes"), cx, move |cx| {
        if let Some(theme) = ThemeRegistry::global(cx)
            .themes()
            .get(&theme_name)
            .cloned()
        {
            Theme::global_mut(cx).apply_config(&theme);
        }
    }) {
        tracing::error!("Failed to watch themes directory: {}", err);
    }
}