Fluent Themes and Icons

Introduction

This release introduces a cohesive set of Fluent Design–based visual assets, including updated themes and icon packs aligned with the Microsoft Fluent Design System. Together, these additions provide a consistent and modern UI layer for Wisej.NET applications, combining structured layouts, refined color systems, and standardized iconography.

The Fluent themes and icons are designed to work seamlessly within the Wisej.NET theming infrastructure, ensuring visual consistency across components while maintaining flexibility for customization. With support for both light and dark variants, as well as filled and outlined icon styles, developers can implement adaptive interfaces that align with user preferences, accessibility requirements, and contemporary design standards.

Themes

Extended the theming system with four new built-in themes: FluentLight-5, FluentDark-5, Material-4, and MaterialDark-4. These additions provide modern, design-system-aligned styling options with improved consistency, readability, and accessibility across Wisej.NET applications.

Technical Highlights

  • Multiple Design Systems

    • FluentUI Light / Dark: Based on the Microsoft Fluent Design System, offering clean layouts, balanced spacing, and refined color schemes.

    • Material / Material Dark: Inspired by Material Design principles, focusing on structured layouts, depth, and visual hierarchy.

  • Light & Dark Variants Each design system includes light and dark modes optimized for different lighting conditions and user preferences, with consistent contrast and accessibility considerations.

  • Native Theming Engine Integration All themes are delivered as standard Wisej.NET theme definitions and integrate seamlessly with the existing theming infrastructure.

  • Runtime Theme Switching Supports dynamic switching between themes at runtime, enabling user-driven customization or system-based theme adaptation.

  • Customization & Extensibility Themes can be extended using the Wisej.NET Theme Builder or JSON mixins to adjust colors, typography, and component styling.

  • Cross-Platform Consistency Ensures uniform rendering and behavior across supported browsers and devices.

These themes expand the visual capabilities of Wisej.NET, enabling developers to align applications with modern UI standards while maintaining full control over customization.

Live Demo

Find a fluent sample app here: https://demo.wisej.net/#Preview/FluentUI%20Themes/Featuresarrow-up-right

Icon Packs

Added two new icon libraries: FluentUI Filled Icons and FluentUI Outlined Icons, providing a comprehensive set of modern, Fluent Design–aligned icons for Wisej.NET applications.

circle-exclamation

Technical Highlights

  • Dual Icon Styles

    • Filled Icons: Optimized for emphasis and high-visibility UI elements.

    • Outlined Icons: Lightweight, minimal style suited for clean and less dense interfaces.

  • Design Consistency Icons follow the visual language of the Microsoft Fluent Design System, ensuring seamless integration with FluentUI themes.

  • Scalable Vector Assets Delivered as vector-based resources, ensuring sharp rendering across resolutions and DPI settings.

  • Seamless Integration Fully compatible with Wisej.NET controls and theming, enabling straightforward usage across components.

  • Flexible Usage Suitable for toolbars, navigation, dashboards, and custom UI elements, with consistent styling across the application.

These icon packs enhance visual consistency and provide developers with a modern, standardized iconography set aligned with FluentUI-based interfaces.

Live Demo

see all Fluent Icons here https://demo.wisej.net/#Preview/FluentUI%20Outlined/Featuresarrow-up-right and here https://demo.wisej.net/#Preview/FluentUI%20Filled/Featuresarrow-up-right

Last updated

Was this helpful?