diff --git a/source/Ox.UI/Ox.UI.js b/source/Ox.UI/Ox.UI.js
index c2a9d02a..f15f1073 100644
--- a/source/Ox.UI/Ox.UI.js
+++ b/source/Ox.UI/Ox.UI.js
@@ -4,7 +4,6 @@ Ox.load.UI = function(options, callback) {
 
     options = Ox.extend({
         hideScreen: true,
-        loadImages: true,
         showScreen: false,
         theme: 'classic'
     }, options);
@@ -44,10 +43,19 @@ Ox.load.UI = function(options, callback) {
             }
         ],
         browserSupported = false,
-        imageNames = {},
-        imageURLs = {},
+        colors = {
+            marker: {
+                '#000000': 'videoMarkerBorder',
+                '#FFFFFF': 'videoMarkerBackground'
+            },
+            symbol: {
+                '#FF0000': 'symbolWarningColor'
+            }
+        },
+        images = {},
         isInternetExplorer = /MSIE/.test(navigator.userAgent),
-        loadingInterval;
+        loadingInterval,
+        themes = {};
 
     browsers.forEach(function(browser) {
         var match = browser.regexp && browser.regexp.exec(navigator.userAgent);
@@ -216,52 +224,42 @@ Ox.load.UI = function(options, callback) {
 
         Ox.getFile(Ox.PATH + '/Ox.UI/jquery/jquery.js', function() {
             initUI();
-            Ox.getJSON(Ox.UI.PATH + 'json/Ox.UI.files.json?' + Ox.VERSION, function(files) {
-                var promises = [], themes = {};
-                files.forEach(function(file) {
-                    var dfd = new $.Deferred();
-                    promises.push(dfd.promise());
-                    if (/\.json$/.test(file)) {
-                        Ox.getJSON(Ox.PATH + file + '?' + Ox.VERSION, function(data) {
-                            var theme = /\/(\w+)\.json$/.exec(file)[1];
+            Ox.getJSON(Ox.UI.PATH + 'json/Ox.UI.json?' + Ox.VERSION, function(data) {
+                var counter = 0, length = data.files.length;
+                images = data.images;
+                data.files.forEach(function(file) {
+                    if (/\.jsonc$/.test(file)) {
+                        Ox.getJSONC(Ox.PATH + file + '?' + Ox.VERSION, function(data) {
+                            var theme = /\/themes\/(\w+)\/json\//.exec(file)[1];
                             themes[theme] = data;
-                            dfd.resolve();
+                            ++counter == length && initThemes();
                         });
                     } else {
                         Ox.getFile(Ox.PATH + file, function() {
-                            dfd.resolve();
+                            ++counter == length && initThemes();
                         });
                     }
                 });
-                var dfd = new $.Deferred();
-                promises.push(dfd.promise());
-                Ox.getJSON(Ox.UI.PATH + 'json/Ox.UI.image' + (
-                    options.loadImages ? 'Data' : ''
-                ) + 'URLs.json?' + Ox.VERSION, function(images) {
-                    imageURLs = images;
-                    Ox.forEach(imageURLs, function(url, key) {
-                        imageNames[url] = key.split('/')[1];
-                    });
-                    dfd.resolve();
-                });
-                $.when.apply(null, promises)
-                    .done(function() {
-                        Ox.forEach(themes, function(data, theme) {
-                            Ox.Theme[theme] = data;
-                        });
-                        $(function() {
-                            if (options.showScreen && options.hideScreen) {
-                                Ox.UI.hideLoadingScreen();
-                            }
-                            callback(browserSupported);
-                        });
-                    })
-                    .fail(function() {
-                        throw new Error('File not found.')
-                    });
             });
         });
-        
+
+    }
+
+    function initThemes() {
+
+        Ox.Theme.getThemes = function() {
+            return Object.keys(themes);
+        };
+        Ox.Theme.getThemeData = function(theme) {
+            return themes[theme || Ox.Theme()];
+        };
+        $(function() {
+            if (options.showScreen && options.hideScreen) {
+                Ox.UI.hideLoadingScreen();
+            }
+            callback(browserSupported);
+        });
+
     }
 
     function initUI() {
@@ -313,36 +311,52 @@ Ox.load.UI = function(options, callback) {
         //@ Ox.UI.elements <o> reference to all UI element instnaces
         Ox.UI.elements = {};
         /*@
-        Ox.UI.getImageName <f> get image name from url
+        Ox.UI.getImageData <f> Returns image properties
             (url) -> <s> Image Name
         @*/
-        Ox.UI.getImageName = function(url) {
-            return imageNames[url];
-        };
+        Ox.UI.getImageData = Ox.cache(function(url) {
+            var str = 'data:image/svg+xml;base64,';
+            return Ox.startsWith(url, str)
+                ? JSON.parse(atob(url.split(',')[1]).match(/<!--(.+?)-->/)[1])
+                : null;
+        });
         /*@
         Ox.UI.getImageURL <f> Returns an image URL
-            (name[, theme[, color]]) -> <s> Image URL
-                Setting color works only when the `loadImages` option is set to
-                `true`.
+            (name[, color[, theme]]) -> <s> Image URL
+            name <s> Image name
+            color <s|[n]> Color name or RGB values
+            theme <s> Theme name
         @*/
-        Ox.UI.getImageURL = function(name, theme, color) {
-            var imageURL;
+        Ox.UI.getImageURL = Ox.cache(function(name, color, theme) {
+            Ox.print('getImageURL', name, color, theme)
+            var colorName,
+                image = images[name],
+                themeData,
+                type = Ox.toDashes(name).split('-')[0];
+            color = color || 'default';
             theme = theme || Ox.Theme();
-            color = Ox.Theme[theme].color[color] || null;
-            // fixme: not the best idea to do this here
-            if (name == 'symbolPlay') {
-                name = 'symbolRight';
+            themeData = Ox.Theme.getThemeData(theme);
+            if (type == 'symbol') {
+                if (Ox.isString(color)) {
+                    colorName = color;
+                    color = themeData['symbol' + Ox.toTitleCase(color) + 'Color'];
+                }
+                image = image.replace(/#808080/g, '#' + Ox.toHex(color));
             }
-            imageURL = imageURLs[theme + '/' + name];
-            if (options.loadImages && color) {
-                imageURL = 'data:image/svg+xml;base64,' + btoa(
-                    atob(imageURL.split(',')[1]).replace(
-                        /#[0-9A-F]{6}/i, '#' + Ox.toHex(color)
-                    )
+            Ox.forEach(colors[type], function(name, hex) {
+                image = image.replace(
+                    new RegExp(hex, 'g'),
+                    '#' + Ox.toHex(themeData[name])
                 );
-            }
-            return imageURL;
-        };
+            });
+            return 'data:image/svg+xml;base64,' + btoa(
+                image + '<!--' + JSON.stringify(Ox.extend(color ? {
+                    color: colorName
+                } : {}, {
+                    name: name, theme: theme
+                })) + '-->'
+            );
+        });
         /*@
         Ox.UI.getVideoFormat <f> Get supported video formats
             (formats) -> <a> of supported formats