DotNetT2 Light_1200x303

We listened to your feedback for a fresh Office Theme, and with the R1 2021 release of the Telerik UI for WinForms suite we have introduced the brand new Office2019Light theme—inspired by the well-known Microsoft Office productivity suite.

The Telerik UI for WinForms suite offers a large set of office themes starting with Office2007 (blue, black and gray), Office2010 (blue, black and gray) and finishing with Office2013 (light and dark).

Despite a big gap since our last Office theme (2013), we have never stopped working on new themes. In the last few years, we introduced themes based on the latest trends: Material design (Material themes), Fluent design (Fluent and FluentDark themes) and Mac-inspired (Crystal and CrystalDark) themes.

After receiving feedback that a new Office theme is important for you, we put it at the top of our themes list, and I am happy to announce the Office2019Light theme with today’s blog post. 🙂

Office themes are evolving, and the new Office2019 theme is no exception from this rule. To be honest, in my eyes this is the most complete, modern and good-looking theme in the Telerik UI for WinForms suite. Inspired by the well-known Microsoft Office productivity suite, it will help you deliver that fresh and smooth look and feel directly into your WinForms apps.

The colors of the theme are as its name says—light. For accent colors, our designers have chosen the color variations of blue. Here is a list of the colors used in the theme.

Office2019Light palette includes blues, whites, grays, black, and red

It is time to have a look at the theme. Here are some of the most popular controls in Telerik UI for WinForms suite with Office2019Light theme applied.

RadGridView:

RadGridView shows a table with a white background, black type and gray borders. The selected row is royal blue. The hover state is light blue. And searched '175' results are highlighted in a blue between those other two blue colors.

RadScheduler:RadScheduler show a calendar in which the workday hours have a very light warm gray background while off hours are white. The borders are a medium gray. Today is highlighted with a bright blue border. The date row is otherwise light blue, and the hover is a darker shade of light blue. One event has a pale yellow background. Two other events have a dark red left edge; one of those has a lavender backdrop.

RadRichTextEditor:RadRichTextEditor show a word processor with a white background and black type. Highlighted type is in a light blue.

You can review the theme in details in the Theme Viewer tool and in our Demo Application.

To add the theme to your project(s), you can use the Project Configuration Wizard. Just navigate to the “Configure Project” item from the Telerik menu in Visual Studio as shown in the image below:

Telerik > Telerik UI for WinForms > Configure Project

In the second step of the wizard, you will see new Office2019Light theme:

Configuration Wizard. In a Progress Configure Project window, a list of themes to select from offers a preview of currently selected Office2019Colorful

To apply the theme to the whole application simply add the following line of code:

ThemeResolutionService.ApplicationThemeName = "Office2019Light";

Glyphs

All fonts are rendered crystal clear on higher DPI settings. Therefore, we designed the theme with font glyphs (symbols) for each symbol and arrow. This guarantees that on high DPI settings the theme will look pixel-perfect.

The font glyphs used in Office2019 theme are from the well-known TelerikWebUI font. This font provides a large number of icons, and a full list with the font glyphs is available at the following link: https://docs.telerik.com/devtools/wpf/styling-and-appearance/glyphs/common-styles-appearance-glyphs-reference-sheet.

To use a glyph in your application, just copy the glyph number from the glyph reference sheet. Then assign the glyph to the Text property of a RadButton (❕note that before the glyph code you need to add "\u", because this is hexadecimal code). And the final step is to set the font of the control. Below you can find an example how to add glyphs to Submit and Cancel buttons with the corresponding foreground colors:

this.radButton1.Text = "\ue11A";
this.radButton1.ForeColor = Color.Green;
this.radButton1.ButtonElement.TextElement.CustomFont = "TelerikWebUI";
this.radButton1.ButtonElement.TextElement.CustomFontSize = 14;
 
this.radButton2.Text = "\ue11D";
this.radButton2.ForeColor = Color.Red;
this.radButton2.ButtonElement.TextElement.CustomFont = "TelerikWebUI";
this.radButton2.ButtonElement.TextElement.CustomFontSize = 14;

glyphs- two circular icons, a green circle with a check, and a red circle with an X. The check is being hovered with a tooltip reading 'Submit'.

What’s Coming Next 🤩

As you may have guessed from the name of this theme—Office 2019 Light—I can confirm that we will not stop with only the Light edition. We are currently working on two Office 2019 theme variations—Gray and Dark, which we plan to include in the next Telerik UI for WinForms release, R2 2021. Here are some snapshots from the themes:

Office2019Gray theme

office2019gray looks very much like Light theme, but its background is gray rather than white, so everything gets a little darker shade.

Office2019Dark theme

office2019dark theme is essentially the inverse of Light, with a black background and white type. The highlights are still in blues.

In addition to the two new themes, we plan to add an option to change the accent color of the Office2019 themes from blue to any color you like using our theme modification tool—Visual Style Builder😎.

Office2019Light with orange accent colorsoffice2019 light but instead of the shades of blue, we see shades of orange as accent colors.

Share Your Feedback

Feel free to drop us a comment below sharing your thoughts. We would love to hear how all this works for you. 😊 You can visit our UI for Winforms Feedback portal and let us know if you have any suggestions for particular features/controls.

If you haven't tried the Telerik UI for WinForms, you should check out our free trial or, better yet—go though all our UI suites in the DevCraft bundle!


TodorPic
About the Author

Todor Vyagov

Todor Vyagov is a Software Developer on the WinForms team at Progress.

Related Posts

Comments

Comments are disabled in preview mode.