Nova.Avalonia.UI is a comprehensive suite of UI controls for Avalonia UI, designed to help developers build modern, accessible, and high-performance cross-platform applications.
Try the live web gallery. Explore the controls and layout panels in your browser, with no installation required.
Nova Avalonia UI requires Avalonia 12.1.1 or later in the Avalonia 12 release line.
Install the main controls and layout panels:
dotnet add package Nova.Avalonia.UIRegister the Nova themes after your Avalonia base theme:
<Application.Styles>
<FluentTheme />
<StyleInclude Source="avares://Nova.Avalonia.UI/Themes/Controls.axaml" />
</Application.Styles>Features with larger third-party dependencies are available separately:
dotnet add package Nova.Avalonia.UI.BarcodeGenerator
dotnet add package Nova.Avalonia.UI.CodeViewerThe documentation covers everything from first steps to detailed control APIs and samples:
Read the Nova.Avalonia.UI documentation
Open the WebAssembly gallery to try the controls and layout panels, switch between light and dark themes, and view sample code.
To run the web sample locally, install the .NET 10 SDK, then run these commands from the repository root:
dotnet workload install wasm-tools
dotnet run --project src/Nova.Avalonia.UI.Gallery.BrowserInstall wasm-tools once. Open the local URL printed in the terminal and keep the command running while testing. The sample must be served over HTTP; opening wwwroot/index.html directly will not run it.
The shared gallery lives in src/Nova.Avalonia.UI.Gallery. To run it on your desktop:
dotnet run --project src/Nova.Avalonia.UI.Gallery.DesktopMobile hosts are available at src/Nova.Avalonia.UI.Gallery.iOS and src/Nova.Avalonia.UI.Gallery.Android.
The Avatar control presents a person's identity using an image, initials, icon, or custom content. It includes automatic background generation, size presets, and optional presence status indicators.
The Badge control displays a notification badge on top of other content. It supports numeric counts with overflow handling (e.g., "99+"), dot mode, various placements, and customizable styling.
The BarcodeGenerator control generates and renders various barcode symbologies including QR codes, Data Matrix, Code 128, EAN-13, and more. It supports customizable colors, error correction levels, and logo overlays.
The optional Nova.Avalonia.UI.CodeViewer package displays read-only source code with syntax highlighting, line numbers, and copy support. It also includes a compact button that opens several source files in a drawer, which is useful for samples and galleries.
TextMate highlighting is enabled on desktop targets. Mobile Apple and Android targets use the same viewer with plain text because the tokenizer's native dependency is not available there. Browser (WebAssembly) targets are not supported yet, so the WebAssembly gallery does not include the Code Viewer sample or the source code button.
Code Viewer is kept in a separate package because it uses AvaloniaEdit and its TextMate grammars. Applications that do not show source code can continue using Nova.Avalonia.UI without those extra dependencies.
dotnet add package Nova.Avalonia.UI.CodeViewerRegister its styles after your base Avalonia theme:
<StyleInclude Source="avares://Nova.Avalonia.UI.CodeViewer/Themes/Controls.axaml" />See the Code Viewer documentation for examples.
The PinBox control provides a specialized input field for PIN codes, OTP verification, and security codes. It features individual character boxes, grouping separators, read-only display, text normalization, validation, masking, responsive sizing, command binding, accessibility value support, and multiple theme presets.
The CompareSlider control enables users to compare two pieces of content side-by-side. A draggable divider allows the user to reveal more of the "before" or "after" content interactively.
The FortuneWheel and FortuneBar controls provide interactive spin-to-win functionality for games, raffles, and random selection scenarios. Features include smooth animations, weighted selection, customizable styling strategies, and configurable indicators.
The RatingControl allows users to view and set ratings using interactive items such as stars, hearts, or custom shapes. It supports multiple precision levels, customizable appearance, and full keyboard and pointer interaction.
The Shimmer control shows a lightweight skeleton while your content is loading. It inspects the visual tree beneath it to draw shapes that match controls, then animates a gradient sweep over the placeholders.
The Gravatar control generates GitHub-style identicon avatars from identifiers such as emails or usernames. It supports custom image overrides, configurable sizes, and pluggable generators via the IGravatarGenerator interface.
The Scratcher control temporarily hides content beneath an opaque overlay. Users can reveal the hidden content by "scratching" the overlay with pointer input, similar to a physical scratch card.
The SegmentedSlider control displays a range value across equal or custom weighted segments. It supports segment labels, snapping, keyboard interaction, read-only mode, and Avalonia-style styling through inherited properties and theme resources.
The Shield control displays a subject and status in a badge-like format, similar to shields.io badges. It's commonly used to show build status, version numbers, licenses, or other metadata in a compact, visually distinct way.
The Watermark control renders repeating text or image patterns as a tiled overlay. Useful for marking documents as confidential, draft, or adding branding.
The ArcPanel arranges items along an arc (partial circle). Useful for semi-circular menus, dial interfaces, or decorative layouts.
A specialized panel reproducing Figma's Auto Layout behavior (Orientation, Spacing, Padding, Alignment).
The BubblePanel packs circular items using a circle packing algorithm, creating a dense, organic bubble arrangement.
The CircularPanel arranges items evenly around a circle. Perfect for radial menus, clock faces, or circular arrangements.
The HexPanel arranges items in a honeycomb hexagonal grid. It supports both flat-topped and pointy-topped hexagons.
The LoopPanel creates an infinite scrolling experience where children wrap seamlessly. It supports drag gestures, mouse wheel, momentum (inertia), and snap-to-item behavior.
The OrbitPanel arranges child elements in concentric orbit rings around a center point. Items are distributed evenly radiating from the center.
The OverlapPanel stacks children with configurable X/Y offsets, creating card pile or layered effects.
The RadialPanel positions items in a circular or spiral fan arrangement. It supports configurable radius, start/sweep angles, and item rotation.
The ResponsivePanel is an adaptive panel that toggles visibility of children based on breakpoints (Mobile/Desktop switching).
The StaggeredPanel positions items in a staggered grid, creating a masonry-like effect by filling the shortest column first.
The TimelinePanel arranges items in a timeline or step-by-step flow with connecting lines between items.
The VariableSizeWrapPanel arranges varying-sized items in a wrapping grid, permitting items to span multiple rows and columns similar to the Windows Start Screen.
The VirtualizingStaggeredPanel is a high-performance staggered grid optimized for large datasets (1000+ items). It works seamlessly with ItemsControl and ScrollViewer.
The VirtualizingVariableSizeWrapPanel is a high-performance variable-size tile grid optimized for large datasets. Supports ColumnSpan and RowSpan attached properties for tiles spanning multiple cells.
Do you want to contribute?.
Found a Bug?
If you find a bug, you can help me by submitting an issue. Even better, you can submit a Pull Request with a fix.
Submitting a pull request
For every contribution, you must:
- Test your code.
- target main branch (or an appropriate release branch if appropriate for a bug fix).
To build all NuGet and symbol packages locally, run:
./build/pack-nuget.sh 1.0.0See Releasing Nova Avalonia UI for the tag-based automated release process.
Use GitHub Issues for bug reports and feature requests.
Code released under the MIT license.