Package | Stable | Preview |
---|---|---|
Uno.Fonts.Fluent | ||
Uno.Fonts.Roboto | ||
Uno.Fonts.OpenSans |
Repository for NuGet packages that can be added to install fonts for any new or existing Uno application. Uno.Fonts currently offers the following fonts as NuGet packages:
An open source icon font for the Fluent design system. Uno FluentUI Assets is intended to be a drop-in replacement for Microsoft's Segoe MDL2 Assets font for use with Uno Platform, WinUI and UWP apps.
This repository includes two icon fonts:
- Uno Fluent Icons - matches the Windows 11 iconography style
- Uno MDL2 Assets - matches the Windows 10 iconography style
Both fonts use the same font family name and file names to make it possible to easily swap them in place.
Some icons are unique to the font, the other ones come from multiple sources:
Fluent UI System Icons https://github.com/microsoft/fluentui-system-icons
Icons 8 Line awesome https://github.com/icons8/line-awesome
Winjs symbols https://github.com/winjs/winjs/tree/master/src/fonts
Here are some steps to update the font to add missing icons:
- Download FontForge
- Open the existing
.ttf
font file - Find the character you want to change by using Goto (in the view menu or ctrl+shit+>, make sure to prefix the hex code with an
u
) - Open the symbol you wish to change by double clicking on it
- Import a symbol from the newly opened window using the EPS format or other compatible format
- Export the font in File > Generate to all the required formats (
.ttf
and.woff2
)
- For ttf, use TrueType not TrueType(Symbols) for more info you can go here https://fontforge.org/docs/ui/dialogs/generate.html.
- There is no need to save the FontForge format since you can open a font from any of the supported format (You can use this to test if the font as been correctly modified).
- You can ignore the
.g2n
file
The recommended, open source, font family for Google's visual language Material Design. Uno.Fonts.Roboto comes pre-packaged within the Uno Material and Uno Material Toolkit libraries.
Simply install the desired Uno.Fonts NuGet package into your Uno project's shared class library. You will then be able to reference the font files from your XAML, like so:
<FontFamily x:Key="MyRobotoLightFontFamily">ms-appx:///Uno.Fonts.Roboto/Fonts/Roboto-Light.ttf</FontFamily>
NOTE: If you are using the older versions of the Uno solution templates (with the
.shproj
file) then you will need to install the font NuGet package into each platform's.csproj
If you have an existing Uno Platform application using an older version of the font and want to update to the latest, the following steps are needed:
- Find all files with the name
uno-fluentui-assets.ttf
and replace them with the same file from the updated icon font. - Inside of the WebAssembly project find the
Fonts.css
file and replace it with the one provided by updated icon font.
- Remove all existing Roboto font files from the application (including those under the Assets/ folder for either your shared project or for each specific platform head)
- Remove references to the font file from
info.plist
if you are targetting iOS/macOS/Catalyst - Inside of the WebAssembly project find the
Fonts.css
file and remove any references to the Roboto font, such as@font-face { font-family: 'Roboto'; ... }
.
OpenSans is an open source humanist sans serif typeface designed by Steve Matteson. It's intended to be a replacement for Segoe UI for Uno applications, as Segoe UI isn't available on some platforms. In Uno 5.3, we introduce the ability to change the default font to OpenSans which is served through Uno.Fonts.OpenSans NuGet package. For more information, see Fonts documentation.