Skip to content
This repository has been archived by the owner on Nov 30, 2019. It is now read-only.


Folders and files

Last commit message
Last commit date

Latest commit


Repository files navigation

Subscribe to UISS mailing list.

What is UISS?

UISS stands for UIKit Style Sheets.

UISS is an iOS library that provides you with a convenient way to define the style of your application. UISS is built on top of UIKit UIAppearance proxies.

What UISS can do for you?

UISS has the power to:

  • replace unreadable UIAppearance code with a simple JSON dictionary,
  • provide a way to change application style without the need to rebuild your code, without the need to restart your app, even without the need to reload your views - yep, this is the sexy feature of UISS.

Design goal

UISS do not enforce any dependencies on your app. You can generate Objective-C code for your UISS style so you do not even have to link with UISS library in your production build.

But how does it really look?

Assuming you're familiar with UIAppearance proxy you probably wrote a piece of code similar to this one:

[[UITabBar appearance] setTintColor:[UIColor darkGrayColor]]

in UISS it looks like this:

    "UITabBar": {
        "tintColor": "darkGray",

no big difference here, so lets look at more complex example:

[[UIButton appearance] setTitleColor:[[UIColor whiteColor] colorWithAlphaComponent:0.800]
[[UIButton appearance] setTitleColor:[UIColor whiteColor]
[[UIButton appearance] setBackgroundImage:[[UIImage imageNamed:@"button-background-normal"]
              resizableImageWithCapInsets:UIEdgeInsetsMake(0.0, 10.0, 0.0, 10.0)]
[[UIButton appearance] setBackgroundImage:[[UIImage imageNamed:@"button-background-highlighted"]
              resizableImageWithCapInsets:UIEdgeInsetsMake(0.0, 10.0, 0.0, 10.0)]
[[UILabel appearanceWhenContainedIn:[UIButton class], nil] setFont:[UIFont fontWithName:@"Copperplate-Bold" size:18.0]];
[[UIButton appearance] setTitleEdgeInsets:UIEdgeInsetsMake(1.0, 0.0, 0.0, 0.0)];
	    "titleColor:normal":["white", 0.8],
	    "backgroundImage:normal": ["button-background-normal", [0,10,0,10]],
	    "backgroundImage:highlighted": ["button-background-highlighted", [0,10,0,10]],
	    "titleEdgeInsets": [1,0,0,0],
	        "font":["Copperplate-Bold", 18]


  • get the code
  • add UISS.xcodeproj to your project
  • (optional) add UISSResource.bundle to your target

Configure UISS


The simplest way to start with UISS is to create uiss.json file and add it to your project's resources. To activate this file add this line:

[UISS configureWithDefaultJSONFile];

This should be called before your views are displayed, the common place for that is your Application Delegate's didFinishLaunching method.


If you want to load your style from remote location to enable live updates, here's how to do that:

self.uiss = [UISS configureWithURL:[NSURL URLWithString:@"http://localhost/uiss.json"]];

Live updates

UISS can detect if your style changed and automatically update your interface. To enable this feature call this method:

uiss.autoReloadEnabled = YES;
uiss.autoReloadTimeInterval = 1;

Status bar

uiss.statusWindowEnabled = YES;

UISS will take a small portion of the screen (usually taken by status bar) to show you what is going on behind the scenes.


Tapping on UISS status bar will present console view where:

  • you can get info about errors in your style
  • you can generate UIAppearance code for your style


Axis parameters



UISS has value converters for every type used to set UIAppearance properties. These converters provide useful shortcuts and convinient syntax for defining your properties.

Here are some examples and eqivalent values in Objective-C code.



[UIColor colorWithRed:1.0f green:1.0f blue:1.0f alpha:1]

Default UIColor colors

[UIColor redColor]
[UIColor redColor]

Colors with pattern image

[UIColor colorWithPatternImage:@"patternImageName"]


[0, 255, 255]
[UIColor colorWithRed:0.0f green:1.0f blue:1.0f alpha:1.0f]

Colors with alpha

["#ffffff", 0.5]
[UIColor colorWithRed:1.0f green:1.0f blue:1.0f alpha:.0.5f]
["red", 0.5]
[[UIColor redColor] colorWithAlphaComponent:0.5f]
[0, 255, 255, 0.5]
[UIColor colorWithRed:0.0f green:1.0f blue:1.0f alpha:.0.5f]


Simple image with name:

[UIImage imageNamed:@"imageName"]

Resizable images:

["imageName", 1, 2, 3, 4]
[[UIImage imageNamed:@"imageName"] resizableImageWithCapInsets:UIEdgeInsetsMake(1, 2, 3, 4)]


[UIFont systemFontOfSize:14.0f]
["bold", 14]
[UIFont boldSystemFontOfSize:14.0f]
["italic", 20]
[UIFont italicSystemFontOfSize:14.0f]
["Georgia-Italic", 12]
[UIFont fontWithName:@"Georgia-Italic" size:12.0f]


	"font": ["bold", 12],
	"textColor": "black",
	"textShadowColor": "lightGray",
	"textShadowOffset": [1, 2]
[NSDictionary dictionaryWithObjectsAndKeys:
 [UIFont boldSystemFontOfSize:12], UITextAttributeFont,
 [UIColor blackColor], UITextAttributeTextColor,
 [UIColor lightGrayColor], UITextAttributeTextShadowColor,
 [NSValue valueWithUIOffset:UIOffsetMake(1, 2)], UITextAttributeTextShadowOffset, nil];



JSON Objective-C
1 CGSizeMake(1, 1)
[1] CGSizeMake(1, 1)
[1, 2] CGSizeMake(1, 2)


JSON Objective-C
[1, 2, 3, 4] CGRectMake(1, 2, 3, 4)


JSON Objective-C
[1, 2, 3, 4] UIEdgeInsetsMake(1, 2, 3, 4)


JSON Objective-C
1 UIOffsetMake(1, 1)
[1] UIOffsetMake(1, 1)
[1, 2] UIOffsetMake(1, 2)


JSON Objective-C
1 CGPointMake(1, 1)
[1] CGPointMake(1, 1)
[1, 2] CGPointMake(1, 2)

UIKit Enums


JSON Objective-C
default UIBarMetricsDefault
landscapePhone UIBarMetricsLandscapePhone


JSON Objective-C
normal UIControlStateNormal
highlighted UIControlStateHighlighted
disabled UIControlStateDisabled
selected UIControlStateSelected
reserved UIControlStateReserved
application UIControlStateApplication


JSON Objective-C
any UISegmentedControlSegmentAny
left UISegmentedControlSegmentLeft
center UISegmentedControlSegmentCenter
right UISegmentedControlSegmentRight
alone UISegmentedControlSegmentAlone


JSON Objective-C
any UIToolbarPositionAny
bottom UIToolbarPositionBottom
top UIToolbarPositionTop


JSON Objective-C
search UISearchBarIconSearch
clear UISearchBarIconClear
bookmark UISearchBarIconBookmark
resultsList UISearchBarIconResultsList


You can define variables that can be used in your UISS style. All variables shoud be defined under Variables key in your style dictionary. To reference a variable prefix its name with $ sign.


	"Variables": {
		"tintColor": "red"

	"UIToolbar": {
		"tintColor": "$tintColor"

User Interface Idioms

Sometimes you want to have a slightly different look on the iPhone from the one you have on the iPad. With UISS you can create parts of style that apply only to a specified UI Idiom.

	"UINavigationBar": {
	    "Phone": {
	        "tintColor": "gray"
	    "Pad": {
	        "tintColor": "lightGray"


JSON specification doesn't support comments. But sometimes being able to easly disable some parts of your UISS style can be really useful. You can do that by adding - prefix to dictionary keys. UISS will ignore those keys without reporting errors.


	"UIToolbar": {
		"-tintColor": "blue",
		"backgroundImage:any:default": "background"
	"-UITabbar": {
		"tintColor": "blue"

This will only set UIToolbar's background image.