メニュー
Use when working with Avalonia UI framework — building, styling, binding, animating, or deploying Avalonia apps with .NET.
Codex または Claude でインストール この Prompt をコピーして Codex、Claude、または他のアシスタントに貼り付けると、Skill ページを確認してインストールできます。
SOC 職業分類に基づく
Use when the user wants to see and choose between visual design alternatives for an Avalonia app before implementation — generates 3 design variants as real .axaml files, renders each to PNGs at multiple viewport sizes (compact/wide × light/dark) using Avalonia.Headless, and serves an HTML comparison gallery via a local web server. The user reviews in their browser and tells the agent which variant to build.
Use when designing or polishing the visual quality of an Avalonia app — choosing themes, building a design system, crafting beautiful screens, improving accessibility, motion, layout, or before shipping a UI. Routes to focused sub-skills for tokens, themes, components, motion, accessibility, layout patterns, icons, and pre-delivery review.
Use when adding or auditing accessibility in an Avalonia app — AutomationProperties, focus order, keyboard navigation, contrast, screen reader (Narrator/NVDA/VoiceOver/Orca) support, dynamic text scaling, reduced motion. Maps WCAG 2.2 AA to Avalonia APIs.
Use when building production-quality Avalonia screens — copy-paste XAML recipes for cards, primary/secondary/icon buttons, dialogs, sidebar nav, command bar, settings page, forms with validation, empty states, toasts, badges, skeletons. All recipes use semantic tokens from the design-system sub-skill.
Use when establishing or refactoring an Avalonia app's design system — semantic color tokens, theme-variant dictionaries (light/dark), typography scale, spacing rhythm, radius and elevation tokens. Produces production-ready Resources/Tokens.axaml.
Use when picking an icon library, drawing custom icons, embedding SVG, or handling images and brand assets in an Avalonia app. Covers Lucide, Material.Icons, Projektanker.Icons, MahApps.IconPacks, FluentSystemIcons, Heroicons, Svg.Skia, PathIcon, and asset performance.
| name | avalonia |
| description | Use when working with Avalonia UI framework — building, styling, binding, animating, or deploying Avalonia apps with .NET. |
Avalonia is a cross-platform .NET UI framework using XAML (.axaml), with its own rendering engine (Skia/Impeller), supporting Windows, macOS, Linux, iOS, Android, and WASM. Avalonia 12 is the current stable version; compiled bindings are enabled by default.
Rule: Always load the matching subskill before writing or reviewing Avalonia code.
| Task | Load subskill |
|---|---|
| XAML markup, .axaml files, namespaces, code-behind | avalonia-xaml |
| Panels, Grid, StackPanel, alignment, margins | avalonia-layout |
| Styles, control themes, selectors, pseudoclasses, themes | avalonia-styling |
{Binding}, compiled bindings, converters, validation | avalonia-data-binding |
| DataTemplate, ItemTemplate, template selection | avalonia-data-templates |
| MVVM pattern, INotifyPropertyChanged, ICommand, CommunityToolkit | avalonia-mvvm |
| Built-in controls (Button, TextBox, DataGrid, etc.) | avalonia-controls |
| Custom UserControl, TemplatedControl, drawing controls | avalonia-custom-controls |
| Brushes, transforms, animations, transitions | avalonia-graphics-animation |
| Pointer, keyboard, gestures, drag-and-drop | avalonia-input-interaction |
| StyledProperty, DirectProperty, AttachedProperty | avalonia-property-system |
| Routed events, bubbling, tunneling | avalonia-events |
| Clipboard, file dialogs, notifications, storage | avalonia-services |
| App structure, resource dictionaries, app lifetime | avalonia-app-development |
| Headless testing, UI automation | avalonia-testing |
| Packaging for macOS/Windows/Linux/WASM | avalonia-deployment |
| Migrating from WPF | avalonia-wpf-migration |
| Designing/polishing UI for visual quality, picking themes, building a design system, motion, accessibility, layout patterns, icons, pre-ship review | avalonia-pro-max |
A curated short-list of the most commonly needed community packages:
| Need | Package |
|---|---|
| Message box dialogs | MsgBox.Avalonia |
| Hot reload during dev | HotAvalonia |
| SVG images | Svg.Skia |
| Animated GIFs | AvaloniaGif |
| Charts | LiveChartsCore.SkiaSharpView.Avalonia or ScottPlot.Avalonia |
| Code editor control | AvaloniaEdit |
| Docking layout | Dock.Avalonia |
| Behaviors (DataTrigger replacement) | Avalonia.Xaml.Behaviors |
| Node editor | NodifyAvalonia (GitHub: BAndysc) |
| Material theme | Material.Avalonia |
| Fluent/WinUI controls | FluentAvalonia |
| Rich dialog service | HanumanInstitute.MvvmDialogs.Avalonia |
| VLC media player | LibVLCSharp.Avalonia |
| PDF viewer | MuPDFCore |
| Deployment packaging | PupNet Deploy (GitHub: kuiperzone/PupNet-Deploy) |
Full community list: https://github.com/AvaloniaCommunity/awesome-avalonia
