shadcn-iced
Menu

Theming

Every theme of shadcn/ui's create page, generated from its OKLCH tokens, in light and dark mode.

Customize

Pick a base color, a theme and a radius: the previews below, and every preview of the site, follow. Then copy the code that builds the theme into your application.

Loading…

Tokens

A theme is an iced::Theme that carries the tokens of shadcn/ui: background,foreground, primary, muted, accent, border,ring, the chart and sidebar colors, and the radius. Components read them withshadcn_iced::tokens(theme), and so can your own widgets:

container(content).style(|theme: &Theme| {
    let t = tokens(theme);
    container::Style {
        background: Some(t.palette.muted.into()),
        border: style::rounded(t.radius_lg()),
        ..Default::default()
    }
})
InstallationComponents