README.md

Custom Avalonia Themes developed by Devolutions

MacOS Theme [Work in Progress]

(Inspired by @MikeCodesDotNET's earlier draft)

This theme is currently based on Avalonia.Themes.Fluent, both as a fallback for any controls not covered yet and as starting point for our (somewhat simplified) style definitions targeting AppKit macOS look.

While we are prioritizing controls for Devolutions Remote Desktop Manager initially, the goal is to create a theme that helps all of the Avalonia community to bring a native look to their macOS apps.

• Installation
• Styled Controls
  • ✅ Available in the current build
    • AutoCompleteBox
    • Button
    • ButtonSpinner
    • Calendar
      • CalendarButton
      • CalendarDatePicker
      • CalendarDayButton
      • CalendarItem
    • CheckBox
    • ComboBox
      • ComboBoxItem
    • ContextMenu
    • DataGrid
    • EditableComboBox (Custom control)
    • Expander
    • GridSplitter
    • ListBox
      • ListBoxItem
    • Menu
    • MenuFlyoutPresenter
    • MenuItem
    • NumericUpDown
      • ButtonSpinner
    • RadioButton
    • ScrollViewer
      • ScrollBar
    • Separator
    • TabControl
      • TabItem
    • TagInput (Custom control)
    • TextBox
    • ToggleSwitch (basic switch only)
    • ToolTip
    • TreeView
      • TreeViewItem
    • Window
    • Dark mode support
    • Limited inactive window behaviour (Accent colours switch to subdued look)
  • 🚧 In progress ...

    • small improvements & fixes, some code cleanup

    • SplitButton

    • CheckBoxListBox Custom control

    • MultiComboBox Custom control

  • 🔮 Next on the road map ...
    • DropDownButton

Installation

Avalonia 12 required. Packages 2026.6.17-avalonia12 and later require Avalonia 12. The last stable release compatible with Avalonia 11 is 2026.6.16.

Install the Devolutions.AvaloniaTheme.MacOS package via NuGet:

Install-Package Devolutions.AvaloniaTheme.MacOS

or .NET

dotnet add package Devolutions.AvaloniaTheme.MacOS

In your App.axaml, replace the existing theme (e.g. <FluentTheme /> or <SimpleTheme />) with the macOS theme:

<Application ...>
  <Application.Styles>
     <DevolutionsMacOsTheme />
  </Application.Styles>
</Application>

Note: Some global Styles will also be loaded by default, you can opt out by setting GlobalStyles to false (<DevolutionsMacOsTheme GlobalStyles="False" />). GlobalStyles are also available as a separate tag <DevolutionsMacOsThemeGlobalStyles /> to cover scenarios where consumers would like to scope them to some control instead of including them globally. This is may be necessary to prevent styles from "bleeding out" in cases where that might be undesirable.

Styled Controls

Most of the images below are screenshots from the SampleApp test and demo pages - feel free to check out the code there for more detailed usage examples.

For an always up-to-date visual reference you can also browse the baseline screenshots.

	AdornerLayer
✅	AutoCompleteBox
	➡️ See also EditableComboBox in our custom controls
✅	Button
✅	CalendarDatePicker Calendar CalendarItem CalendarButton CalendarDayButton
	Note: MinWidth is set to comfortably accommodate short date formats & the corresponding default watermark when HorizontalAlignment is set to anything other than the default (Stretch). If you set SelectedDateFormat="Long" you will have to override MinWidth to the longest expected string length, depending on supported languages. Otherwise the control's width will jump when the date is changed.
	CaptionButtons
	Carousel
✅	CheckBox
✅	ComboBox ComboBoxItem
✅	ContextMenu
✅	DataGrid
	The editable field still has an issue, forcing the row to be slightly higher than the others Grouped Data
	DataValidationErrors
	DatePicker
	DateTimePickerShared
	DropDownButton
✅	EditableComboBox
	Custom control
	EmbeddableControlRoot
✅	Expander
	FluentControls
	FlyoutPresenter
✅	GridSplitter
	HeaderedContentControl
	HyperlinkButton
	ItemsControl
	Label
✅	ListBox ListBoxItem
	ManagedFileChooser
✅	Menu
	Classes="MacOS_Theme_MenuLabelBelowIcon" for toolbar-style menus Classes="MacOS_Theme_MenuItemIconOnly" to hide labels completely Classes="MacOS_Theme_MenuOpensAbove" for bottom-placed menus
✅	MenuFlyoutPresenter
✅	MenuItem
	See Menu, MenuFlyoutPresenter, ContextMenu
	MenuScrollViewer
	NotificationCard
✅	NumericUpDown ButtonSpinner
	OverlayPopupHost
	PathIcon
	PopupRoot
	ProgressBar
✅	RadioButton
	RefreshContainer
	RefreshVisualizer
	RepeatButton
✅	ScrollViewer ScrollBar
	Default: AllowAutoHide="False": Note that even with AllowAutoHide="True" the scrollbars won't completely hide. This is intentional, since scrolling events will not trigger a 'show' (only moving the pointer directly over the track area will) - so completely hiding would be confusing. Mousing over one of the track areas will make the thumb bar grow wider and darker and the track appears. To suppress this behaviour (e.g. on images) use Classes="MacOS_TransparentTrack"
	SelectableTextBlock
✅	Separator
	See Menu, MenuFlyoutPresenter, ContextMenu
	Slider
	SplitButton
	SplitView
✅	TabControl TabItem
	Vertical tabs may still need some work
	TabStrip
	TabStripItem
✅	TagInput
	Custom control
✅	TextBox
	There appears to be no easy way for styling the caret thickness and margin
	TextSelectionHandle
	ThemeVariantScope
	TimePicker
	TitleBar
	ToggleButton
(✅)	ToggleSwitch
✅	ToolTip
	TransitioningContentControl
✅	TreeView TreeViewItem
	Use Classes="MacOS_Theme_AlternatingRowColor" to achieve striped background. (Cannot currently be rendered with rounded corners & breaks when default TreeViewItem height is altered (see comment in ThemeResources.axaml))
✅	Window
	Controls inherit basic MacOS-specific Fore-/Background & Font styling from Window (or EmbeddableControlRoot)
	WindowNotificationManager