Design

Design Tabs

It’s recommended to use Chrome or Firefox and keep your developer console open so you can inspect the preview. When you’re working with the label, the preview on the right hand side of the screen will update each time you save the design.

CSS

There are several CSS “templates” in the dropdown menu. These are for creating certain pre-defined color bar options. Choosing a template will create an import rule at the top of your stylesheet.

JavaScript

The JavaScript code should run in a self-executing function, which can be created with this syntax:

!function(){
    $('.labelWrap').each(function(){
        //Code Here.
    });
}()

The code inside .each() will be executed for each label on the page. The application itself contains a JavaScript API for performing common label functions.

Data

This is a form where you can test different types of data in the label.