Webix 2.3: New UI Widgets, Typescript and Material Skin

Spring is a time of great changes and endless possibilities! This spring a new Webix version 2.3 has also brought plenty of useful updates and new features.

Webix team has been working hard on adding advanced features and responding to all the great feedback from the Webix Community. Version 2.3 comes with entirely new components such as Organogram and Barcode along with a fresh material skin, TypeScript support and other cool enhancements.

Material Design

Everybody talks about material design. First of all, people discuss it as it was developed by Google. Secondly, it looks really nice and simplifies end users’ work with apps. So Webix is also on-trend and now it can boast of its new attractive Material skin.

The interface of this skin is clean, clear and responsive, the colors for highlighting controls are bright. No excessive elements. Thus, end users will be entirely concentrated on the key issues of your app.

Webix Material Skin

Since version 2.3 it is possible to apply the Material skin to your web app built with Webix. This skin won’t be included in a library package but can be taken from a separate repository at github.com.

Badges for Buttons and Menu items

A new Webix version will allow you to add circle orange badges to buttons and menu items. These badges will show the number of notifications about unread messages, emails, friend requests, your group activities and other updates that a user needs to look through.

Badges for  Webix Buttons and Menu items


Organogram is a new Webix chart widget that will allow you to show a complex structure by means of hierarchical diagram. For instance, you can use this component for displaying the relationships between positions within organization in an easy way.

Webix Organogram

The structure and API of Organogram is similar to Webix Tree one, therefore you won’t spend lots of time to get acquainted with this new widget.

The look of organogram can be customized in accordance with your project requirements. You can configure the dimensions of its items, their arrangement and content as well as adjust the position of the whole component in relation to the container.

You may also easily change the style of Organogram elements through CSS code or by adding various HTML-objects. So, the final design of a widget is at your fingertips.

If you want to find more detailed info about Organogram, you can read Webix documentation.


One more new Webix widget that is a part of version 2.3 is BarCode. It is a machine-readable code in the form of numbers and a pattern of parallel lines of varying widths.

Now you can generate barcodes for your web apps built with Webix in a fast and easy way.

Webix BarCode widget

Thanks to the BarCode predefined standards and its easy adjustability, you can create a barcode that will fit any requirement. Webix Barcode includes definitions for most popular barcodes (EAN8, EAN13 and UPC-A). You can add new ones by using Barcode’s API.


We also have some good news for fans of typescript. Starting from Webix 2.3, you can use the official type definition file. You may download webix.t.ds file or install it by NuGet or by any other package manager.

Webix uses TypeScript

To read more technical details about Webix 2.3, please follow this link.

If you want to download the latest library version, go here.