Irihi.Mafia.Themes.TDesign 0.0.2

Prefix Reserved
dotnet add package Irihi.Mafia.Themes.TDesign --version 0.0.2
                    
NuGet\Install-Package Irihi.Mafia.Themes.TDesign -Version 0.0.2
                    
This command is intended to be used within the Package Manager Console in Visual Studio, as it uses the NuGet module's version of Install-Package.
<PackageReference Include="Irihi.Mafia.Themes.TDesign" Version="0.0.2" />
                    
For projects that support PackageReference, copy this XML node into the project file to reference the package.
<PackageVersion Include="Irihi.Mafia.Themes.TDesign" Version="0.0.2" />
                    
Directory.Packages.props
<PackageReference Include="Irihi.Mafia.Themes.TDesign" />
                    
Project file
For projects that support Central Package Management (CPM), copy this XML node into the solution Directory.Packages.props file to version the package.
paket add Irihi.Mafia.Themes.TDesign --version 0.0.2
                    
#r "nuget: Irihi.Mafia.Themes.TDesign, 0.0.2"
                    
#r directive can be used in F# Interactive and Polyglot Notebooks. Copy this into the interactive tool or source code of the script to reference the package.
#:package Irihi.Mafia.Themes.TDesign@0.0.2
                    
#:package directive can be used in C# file-based apps starting in .NET 10 preview 4. Copy this into a .cs file before any lines of code to reference the package.
#addin nuget:?package=Irihi.Mafia.Themes.TDesign&version=0.0.2
                    
Install as a Cake Addin
#tool nuget:?package=Irihi.Mafia.Themes.TDesign&version=0.0.2
                    
Install as a Cake Tool

<p align="center"> <img src="./assets/mafia.svg" alt="MAFIA" width="296" /> </p>

IRIHI Mafia

English | δΈ­ζ–‡

This project is in early development and not yet ready for production use. APIs, controls, and themes may change significantly between releases. Use at your own risk.

Mobile-first Avalonia UI control library and TDesign-inspired theme.

Irihi.Mafia is a mobile-first Avalonia control library β€” crafted for touch interactions, thumb-friendly sizing, and responsive layouts from the ground up. It also provides a complete visual theme based on TDesign design language, with full light/dark mode support.

Features

  • πŸ“± Mobile-first design β€” Touch-optimized controls, generous tap targets, thumb-friendly spacing
  • 🎨 TDesign-inspired theme β€” A comprehensive light & dark theme with design token system (colors, typography, spacing, radius)
  • 🧩 Custom controls β€” Avatar, Cell/ CellGroup, Divider, IconButton, Picker, Popup and more
  • πŸŒ“ Light/Dark mode β€” Built-in theme variants with consistent color palettes
  • πŸ“¦ Modular packages β€” Core logic library and theme library are separate NuGet packages
  • πŸ–₯️ Cross-platform β€” Works on Windows, macOS, Linux, Android, iOS and Browser via Avalonia

Packages

Package Description NuGet
Irihi.Mafia Core control library β€” provides custom control logic & primitives NuGet
Irihi.Mafia.Themes.TDesign TDesign-inspired visual theme β€” control templates, design tokens, light/dark color schemes NuGet

Getting Started

1. Install the packages

dotnet add package Irihi.Mafia
dotnet add package Irihi.Mafia.Themes.TDesign

You only need Irihi.Mafia if you want to write your own theme; for most projects, install both packages.

2. Apply the theme

In your App.axaml, add the TDesign theme:

<Application xmlns="https://github.com/avaloniaui"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:td="https://irihi.tech/td"
             x:Class="MyApp.App">
    <Application.Styles>
        <td:TDesignTheme />
    </Application.Styles>
</Application>

3. Use the controls

xmlns:m="https://irihi.tech/mafia"


<m:IconButton Icon="emoji_smile"
              Shape="Circle"
              Variant="Outline" />


<m:Cell Description="User settings"
        Note="Manage your preferences"
        IsRequired="True" />


<m:Avatar Width="40" Height="40"
          Source="{Binding ProfileImage}" />

Controls Overview

Many more controls are still in design and development. The current list represents only what has been implemented so far.

Control Description
Avatar Button with an image source, for user avatars
Cell List item with description, note, and inner content slots
CellGroup Groups Cell items under a header
Divider A horizontal or vertical separator line
IconButton Button with icon, loading state, shape and variant options
Picker Drop-down selection control with confirm mode and search
Popup Flexible popup with modal mask, placement and animation support

Project Structure

src/
β”œβ”€β”€ Irihi.Mafia/                      # Core control library
β”‚   β”œβ”€β”€ Controls/                     # Custom control implementations
β”‚   β”‚   β”œβ”€β”€ Avatar/
β”‚   β”‚   β”œβ”€β”€ Cell/
β”‚   β”‚   β”œβ”€β”€ Divider.cs
β”‚   β”‚   β”œβ”€β”€ IconButton.cs
β”‚   β”‚   β”œβ”€β”€ Picker.cs
β”‚   β”‚   └── Primitives/               # Popup, OverlayPopupHost
β”‚   └── Common/                       # Shared enums (Position, PopupPlacement)
β”‚
└── Irihi.Mafia.Themes.TDesign/       # TDesign-themed visual library
    β”œβ”€β”€ TDesignTheme.axaml             # Theme entry point
    β”œβ”€β”€ Controls/                      # 24 ControlTheme definitions
    β”œβ”€β”€ Tokens/                        # Design tokens (colors, fonts, radius, sizes)
    β”œβ”€β”€ Themes/                        # Light & Dark variant resource dictionaries
    └── Styles/                        # Global style selectors

demo/
β”œβ”€β”€ Irihi.Mafia.Demo/                 # Shared demo application
β”œβ”€β”€ Irihi.Mafia.Demo.Desktop          # Windows/macOS/Linux launcher
β”œβ”€β”€ Irihi.Mafia.Demo.Browser          # WebAssembly launcher
β”œβ”€β”€ Irihi.Mafia.Demo.Android          # Android launcher
└── Irihi.Mafia.Demo.iOS              # iOS launcher

Theme Customization

The TDesign theme uses a layered token system, making customization straightforward:

  1. Design tokens (Tokens/) β€” Atomic values for colors, fonts, radius, and spacing
  2. Shared dimensions (Themes/Shared/) β€” Component-level size and padding references
  3. Theme variant (Themes/Light/, Themes/Dark/) β€” Color mappings per light/dark mode
  4. Control templates (Controls/) β€” Visual tree and bindings for each control

To customize, override any DynamicResource key from your app:

<Application.Resources>
    <SolidColorBrush x:Key="TDBrandColor" Color="#FF5722" />
</Application.Resources>

Build from Source

# Clone the repository
git clone https://github.com/irihitech/Irihi.Mafia.git
cd Irihi.Mafia

# Build
dotnet build

# Run tests
dotnet test

# Run the desktop demo
dotnet run --project demo/Irihi.Mafia.Demo.Desktop

Contributing

Contributions are welcome! Please open an issue or submit a pull request.

License

This project is licensed under the MIT License.

Copyright (c) 2026 IRIHI Technology

Product Compatible and additional computed target framework versions.
.NET net8.0 is compatible.  net8.0-android was computed.  net8.0-browser was computed.  net8.0-ios was computed.  net8.0-maccatalyst was computed.  net8.0-macos was computed.  net8.0-tvos was computed.  net8.0-windows was computed.  net9.0 was computed.  net9.0-android was computed.  net9.0-browser was computed.  net9.0-ios was computed.  net9.0-maccatalyst was computed.  net9.0-macos was computed.  net9.0-tvos was computed.  net9.0-windows was computed.  net10.0 was computed.  net10.0-android was computed.  net10.0-browser was computed.  net10.0-ios was computed.  net10.0-maccatalyst was computed.  net10.0-macos was computed.  net10.0-tvos was computed.  net10.0-windows was computed. 
Compatible target framework(s)
Included target framework(s) (in package)
Learn more about Target Frameworks and .NET Standard.

NuGet packages

This package is not used by any NuGet packages.

GitHub repositories

This package is not used by any popular GitHub repositories.

Version Downloads Last Updated
0.0.2 118 8/16/2026
0.0.1 96 8/16/2026