Welcome to Nova.Avalonia.UI

Nova.Avalonia.UI is a comprehensive suite of controls for Avalonia UI. The library bridges the gap between standard framework controls and the complex requirements of modern applications, providing components that are production-ready, fully themeable, and accessibility-first.

Try the controls in the WebAssembly gallery

Overview

Controls

  • Avatar: Identity control supporting images, initials, icons, and status indicators with auto-generated backgrounds.
  • Badge: Notification indicator for counts, status, or dot indicators with configurable placement and overflow handling.
  • BarcodeGenerator: Generates QR codes, Data Matrix, Code 128, and other barcode formats with customizable colors and logo support.
  • CodeViewer: Displays read-only source code inline or opens several source files from a compact button.
  • CompareSlider: A control that allows side-by-side comparison of two pieces of content with a draggable divider.
  • FortuneBar: Slot machine style horizontal or vertical scrolling bar for random selection.
  • FortuneWheel: Circular prize wheel with smooth spin animations, weighted selection, and customizable styling strategies.
  • Gravatar: GitHub-style identicon generator.
  • 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.
  • Shimmer: Skeleton loading effect that detects your content layout to create matching placeholders.
  • Scratcher: Interactive control that hides content beneath a scratchable overlay.
  • Shield: Badge-like control for displaying status, version, or metadata in a compact two-part format (subject + status).
  • Watermark: Tiled text or image overlay for marking documents as confidential, draft, or adding branding.

Panels

  • ArcPanel: Arranges items along an arc (partial circle) for semi-circular menus or dial interfaces.
  • AutoLayout: A layout panel inspired by Figma's Auto Layout with Orientation, Spacing, Padding, and Alignment.
  • AvatarGroup: Layout container for stacking multiple avatars with configurable overlap and overflow handling.
  • AvatarStackPanel: A specialized panel for laying out avatars with overlap.
  • BubblePanel: Packs circular items using a circle packing algorithm for dense, organic layouts.
  • CircularPanel: Arranges items evenly around a circle, perfect for radial menus or clock faces.
  • HexPanel: Layout panel that arranges items in a honeycomb hexagonal grid.
  • LoopPanel: Infinite scrolling panel with looping, inertia, and snap-to-item behavior.
  • OrbitPanel: Arranges child elements in concentric orbit rings around a center point.
  • OverlapPanel: Stacks children with configurable X/Y offsets for card pile effects.
  • RadialPanel: Arranges items in a circular or spiral fan arrangement.
  • ResponsivePanel: Adaptive panel that toggles visibility of children based on breakpoints.
  • StaggeredPanel: Positions items in a staggered grid, creating a masonry-like effect.
  • TimelinePanel: Arranges items in a timeline/step flow with connecting lines.
  • VariableSizeWrapPanel: Arranges varying-sized items in a wrapping grid.
  • VirtualizingStaggeredPanel: High-performance staggered grid for large datasets.
  • VirtualizingVariableSizeWrapPanel: High-performance variable-size tile grid for large datasets.

Input

  • PinBox: Specialized input control for PIN codes, security codes, and OTP entry with validation, masking, and individual character boxes.
  • SegmentedSlider: Range input divided into named segments with configurable titles, colors, and selection behavior.

Requirements

  • Avalonia UI 12.1.1 or later in the Avalonia 12 release line
  • .NET 8 or later for desktop and browser applications
  • .NET 10 for Android and iOS applications
Edit this page