The above logo is based on two symbols:
Fontogram is a method, control type name, and library for generating a large variety of
such icons for Microsoft .NET WPF applications, using a simple scheme for easily combining WPF Label and
Border elements, to create text based on any installed fonts, overlayed on top of a custom backdrop.
The included sample app shows more examples of icons created with Fontogram:
The Fontogram control instances and the generated images are called fontograms.
The Fontogrammer application is a fontogram design tool.
You create an icon by creating an instance of the WPF control class 'Fontogram'. Specify a backdrop and a text,
using any desired attribute values to modify them from their defaults. Multiple backdrop-text pairs can be specified
in the same fontogram, as different layers.
Useful: potentially good looking icons created with simple XAML/C#.
Removes complexity and repetition in creating a set of icons with WPF methods.
Comfort: working with Label and Border objects is familiar to any WPF developer.
Productivity: adding an icon is as fast as creating a control and setting its attributes.
Fun: Fontogrammer makes it easy and rewarding to experiment with different designs.
Quality: the operating system is very good at rendering fonts at any size.
Scalability: fontograms are vector based, so no pixelation; edges always look smooth.
Color: works around WPF's inability to render emoji fonts in multicolor.
Flexibility: unlimited number of backdrop and text elements; decent array of parameters.
Free and open-source.
The provided sample
code shows how to create
custom fontograms in XAML
reusable fontogram packs
in C# code. The code generated for the custom fontograms includes
comments that explain the control attributes.
Use any font that contains the characters you need and is installed on the target computers.
Windows 10 includes by default some particularly useful fonts - containing emojis, symbols, glyphs,
- Segoe UI Emoji
- Segoe UI Symbol
❕ Includes some of the same characters as the "Emoji" font, having a different look.
- Segoe MDL2 Assets
- Wingdings 2
- Wingdings 3
The library and sample code are accompanied by the Fontogrammer tool, which displays a live preview
of the fontogram being designed, and generates the specific XAML and C# code that you need to use.
Fontogrammer can also be used as documentation for Fontogram attributes - see the fields' tooltips.
user interface needs some color, or pictorial aids
need to display icons at arbitrary sizes - especially on the small side
an adequate icon library is not available
no help from a specialized icon designer
must not spend much time on icons
simple monochrome font-based icons are not satisfactory