Skip to content
Mobile
Skill

/maui-theming

Guide for theming .NET MAUI apps—light/dark mode support, AppThemeBinding, dynamic resources, ResourceDictionary theme switching, and system theme detection. USE FOR: "dark mode", "light mode", "theming", "AppThemeBinding", "theme switching", "ResourceDictionary theme", "dynamic

BOOST
From plugin
maui-skills
17541 skills
Install
$ npx -y skills add davidortinau/maui-skills --skill maui-theming --agent claude-code

How it fires

How this skill gets triggered: by you, by Claude, or both.

  • Fires itselfAuto-invocation. Claude auto-loads it when your prompt matches the work.Auto-invocation is when the right skill fires by itself at the right moment, driven by a FLOW.md router and a hook, instead of you invoking it by name. It is the difference between a skill being installed and a skill actually getting used.Read the full definition →
  • You can call itInvoke it directly when you want it.
  • Slash command/maui-theming

Context preview

The summary Claude sees to decide when to auto-load this skill.

Guide for theming .NET MAUI apps—light/dark mode support, AppThemeBinding, dynamic resources, ResourceDictionary theme switching, and system theme detection. USE FOR: "dark mode", "light mode", "theming", "AppThemeBinding", "theme switching", "ResourceDictionary theme", "dynamic

SKILL.md

maui-theming.SKILL.md
name: maui-theming
description: >
  Guide for theming .NET MAUI apps—light/dark mode support, AppThemeBinding,
  dynamic resources, ResourceDictionary theme switching, and system theme detection.
  USE FOR: "dark mode", "light mode", "theming", "AppThemeBinding", "theme switching",
  "ResourceDictionary theme", "dynamic resources", "system theme detection",
  "color scheme", "app theme".
  DO NOT USE FOR: localization or language switching (use maui-localization),
  accessibility visual adjustments (use maui-accessibility), or app icons (use maui-app-icons-splash).

.NET MAUI Theming

Choosing your approach

| Approach | Best for | Limitation | |----------|----------|------------| | **AppThemeBinding** | Auto light/dark with OS — minimal code | Only two themes (light + dark) | | **ResourceDictionary swap** | Custom branded themes, >2 themes, user preference | More setup, must use `DynamicResource` everywhere | | **Both combined** | Auto OS response + custom theme colors | Most flexible but most complex |

Critical gotchas

Android: ConfigChanges.UiMode is REQUIRED

`MainActivity` **must** include `ConfigChanges.UiMode` or theme change events will not fire and the activity restarts instead of handling the change:

[Activity(Theme = "@style/Maui.SplashTheme",
          MainLauncher = true,
          ConfigurationChanges = ConfigChanges.ScreenSize
                               | ConfigChanges.Orientation
                               | ConfigChanges.UiMode  // ← Required for theme detection
                               | ConfigChanges.ScreenLayout
                               | ConfigChanges.SmallestScreenSize
                               | ConfigChanges.Density)]
public class MainActivity : MauiAppCompatActivity { }

Without `UiMode`, toggling dark mode in Android settings causes a full activity restart — losing navigation state and appearing as a crash to users.

CSS themes cannot be swapped at runtime

MAUI supports CSS styling, but CSS-based themes **cannot be swapped dynamically**. Use ResourceDictionary theming for runtime switching.

DynamicResource vs StaticResource

When using ResourceDictionary theme switching, you **must** use `DynamicResource`:

<!-- ✅ Updates when theme dictionary changes -->
<Label TextColor="{DynamicResource PrimaryTextColor}" />

<!-- ❌ Frozen at first load — won't update on theme switch -->
<Label TextColor="{StaticResource PrimaryTextColor}" />

Quick reference

  • **OS light/dark** → `AppThemeBinding` markup extension
  • **Theme colors in C#** → `SetAppThemeColor()`, `SetAppTheme<T>()`
  • **Read OS theme** → `Application.Current.RequestedTheme`
  • **Force theme** → `Application.Current.UserAppTheme = AppTheme.Dark`
  • **Theme changes** → `RequestedThemeChanged` event
  • **Custom switching** → Swap `ResourceDictionary` in `MergedDictionaries`
  • **Runtime bindings** → **`DynamicResource`** (not `StaticResource`)
Read more
Ships withmaui-skills

A collection of 41 skills for .NET MAUI development, UI/UX design reasoning, and Xamarin migration, designed for use with GitHub Copilot CLI and Claude Code.

Get the whole plugin

Other skills on maui-skills.