Learn How Telerik’s 3 New ASP.NET AJAX Skins Differ from All We’ve Released in the Past

Our ASP.NET AJAX control toolset has a set of 20 time-tested skins that have a lot in common in terms of structure and the techniques that we used to create them. In Q1 2013 we decided to provide you with two more skins - Silk and Glow that are not part of the same scheme – they have new dimensions and use CSS3 optimizations. That’s not all - we continued the MetroTouch trend and, as we promised when we introduced the MetroTouch skin, now you have at your disposal the BlackMetroTouch theme that will help you develop beautiful and stylish apps for mobile and touch devices.

Silk and Glow Skins

The Silk and Glow design is inspired by the new mobile tendencies, combined with the already familiar look of Telerik’s ASP.NET AJAX controls. Soft gradients, single pixel outlines, gentle shadows and fewer borders define an airy, fresh and aesthetic look of the themes.

The dimensions are a little bit larger than the other ASP.NET AJAX skins - bigger input fields, buttons, headers and titles, larger paddings and more space between the UI elements will give a modern look and a touch-friendly design to your application.

While creating Silk and Glow we followed the same guidelines and you can use them both in a single application to provide a dark and a light theme, so you can give your users the ability to switch between them easily without making any layout adjustments.

Primary and Secondary Action Buttons

Silk and Glow bring a unique innovation styles for primary and secondary action buttons.  Having two different button designs built-in will enrich the interface of your application and help the users have more intuitive and pleasant experience. You can use them in complicated systems and scenarios with a lot of forms and dialogues that give multiple button selections. Primary buttons use bright and saturated colors that pop up more and catch attention easily. This is a great way to give visual weight to your primary actions and help your users complete their tasks.

Be Minimalistic

Each theme goes with a full set of monochrome icons following the minimal Windows 8 style. They are highly simplified so RadControls can fit in various layouts. The graphic language of the symbols is very clean and will help the users interact with the page without effort.

CSS3

Silk and Glow are built according the CSS3 standards and the soft and slick feel is achieved by CSS3 gradients that will work perfectly in the latest versions of the browsers. Don’t worry, for all of you that still have to support older IE browsers (before IE10) the skins have a fallback system for the gradient and will also keep their layout. The rounded corners of the UI elements are, again, achieved by using CSS3, so do not be disappointed that they won’t be visible in IE 6, 7 and 8.

These two skins were developed using SASS and you can take advantage of the power this technology gives you to customize them with no effort.

Yet another improvement that is related to the LightWeight rendering we are working on are the icons – they are gathered in a single common sprite for all controls that contains all states (normal, hovered, active).

The Black Pearl

BlackMetroTouch is a part of our Metro skins family. It is based on the MetroTouch theme and has the same specifications in terms of size. The color scheme is black, grey and blue, however. It follows the simple design principles of the Windows 8 style and all guidelines for a skin created for touch-enabled apps - enlarged dimensions provide a friendly clickable area, bigger font size and UI elements.

BlackMetroTouch uses the same set of glyphs as in our white Metro skins but inverted for a black theme. The rendering is as simple as in the MetroTouch skin – virtually no background images. You have one action sprite with all status icons which could increase the performance of your application.

Since Q1 2013 SP1 you are able to use our new BlackMetroTouch skin and create elegant, dark applications, you can be stylish and follow the latest Windows 8 design trends in the UI world.

What do you think

Do you like them? You may have already noticed that we are moving towards modern technologies like HTML5 and CSS3, while being reluctant to drop support for older browsers. We are planning on going further with this, so tell us which you find more important, so we can focus on providing the tools that suit your needs! Stay tuned for the next post that will discuss our plans for the skins we ship because the wind of change is blowing hard!