diff --git a/libnymea-app-core/devicemanager.cpp b/libnymea-app-core/devicemanager.cpp
index 2e59dc56..6e26deed 100644
--- a/libnymea-app-core/devicemanager.cpp
+++ b/libnymea-app-core/devicemanager.cpp
@@ -464,9 +464,12 @@ void DeviceManager::browseDeviceResponse(const QVariantMap &params)
         BrowserItem *item = new BrowserItem(itemMap.value("id").toString(), this);
         item->setDisplayName(itemMap.value("displayName").toString());
         item->setDescription(itemMap.value("description").toString());
+        item->setIcon(itemMap.value("icon").toString());
         item->setThumbnail(itemMap.value("thumbnail").toString());
         item->setExecutable(itemMap.value("executable").toBool());
         item->setBrowsable(itemMap.value("browsable").toBool());
+
+        item->setMediaIcon(itemMap.value("mediaIcon").toString());
         itemModel->addBrowserItem(item);
     }
 
diff --git a/libnymea-common/types/browseritem.cpp b/libnymea-common/types/browseritem.cpp
index 98250990..ea46d4b4 100644
--- a/libnymea-common/types/browseritem.cpp
+++ b/libnymea-common/types/browseritem.cpp
@@ -32,6 +32,16 @@ void BrowserItem::setDescription(const QString &description)
     m_description = description;
 }
 
+QString BrowserItem::icon() const
+{
+    return m_icon;
+}
+
+void BrowserItem::setIcon(const QString &icon)
+{
+    m_icon = icon;
+}
+
 QString BrowserItem::thumbnail() const
 {
     return m_thumbnail;
@@ -61,3 +71,13 @@ void BrowserItem::setBrowsable(bool browsable)
 {
     m_browsable = browsable;
 }
+
+QString BrowserItem::mediaIcon() const
+{
+    return m_mediaIcon;
+}
+
+void BrowserItem::setMediaIcon(const QString &mediaIcon)
+{
+    m_mediaIcon = mediaIcon;
+}
diff --git a/libnymea-common/types/browseritem.h b/libnymea-common/types/browseritem.h
index 14bd51cd..3208bc73 100644
--- a/libnymea-common/types/browseritem.h
+++ b/libnymea-common/types/browseritem.h
@@ -10,10 +10,13 @@ class BrowserItem : public QObject
     Q_PROPERTY(QUuid id READ id CONSTANT)
     Q_PROPERTY(QString displayName READ displayName CONSTANT)
     Q_PROPERTY(QString description READ description CONSTANT)
+    Q_PROPERTY(QString icon READ icon CONSTANT)
     Q_PROPERTY(QString thumbnail READ thumbnail CONSTANT)
     Q_PROPERTY(bool executable READ executable CONSTANT)
     Q_PROPERTY(bool browsable READ browsable CONSTANT)
 
+    Q_PROPERTY(QString mediaIcon READ mediaIcon CONSTANT)
+
 public:
     explicit BrowserItem(const QString &id, QObject *parent = nullptr);
 
@@ -25,6 +28,9 @@ public:
     QString description() const;
     void setDescription(const QString &description);
 
+    QString icon() const;
+    void setIcon(const QString &icon);
+
     QString thumbnail() const;
     void setThumbnail(const QString &thumbnail);
 
@@ -34,13 +40,19 @@ public:
     bool browsable() const;
     void setBrowsable(bool browsable);
 
+    QString mediaIcon() const;
+    void setMediaIcon(const QString &mediaIcon);
+
 private:
     QString m_id;
     QString m_displayName;
     QString m_description;
+    QString m_icon;
     QString m_thumbnail;
     bool m_executable = false;
     bool m_browsable = false;
+
+    QString m_mediaIcon;
 };
 
 #endif // BROWSERITEM_H
diff --git a/libnymea-common/types/browseritems.cpp b/libnymea-common/types/browseritems.cpp
index bfcae8d4..e5a67509 100644
--- a/libnymea-common/types/browseritems.cpp
+++ b/libnymea-common/types/browseritems.cpp
@@ -33,12 +33,17 @@ QVariant BrowserItems::data(const QModelIndex &index, int role) const
         return m_list.at(index.row())->displayName();
     case RoleDescription:
         return m_list.at(index.row())->description();
+    case RoleIcon:
+        return m_list.at(index.row())->icon();
     case RoleThumbnail:
         return m_list.at(index.row())->thumbnail();
     case RoleExecutable:
         return m_list.at(index.row())->executable();
     case RoleBrowsable:
         return m_list.at(index.row())->browsable();
+
+    case RoleMediaIcon:
+        return m_list.at(index.row())->mediaIcon();
     }
     return QVariant();
 }
@@ -49,9 +54,12 @@ QHash<int, QByteArray> BrowserItems::roleNames() const
     roles.insert(RoleId, "id");
     roles.insert(RoleDisplayName, "displayName");
     roles.insert(RoleDescription, "description");
+    roles.insert(RoleIcon, "icon");
     roles.insert(RoleThumbnail, "thumbnail");
     roles.insert(RoleExecutable, "executable");
     roles.insert(RoleBrowsable, "browsable");
+
+    roles.insert(RoleMediaIcon, "mediaIcon");
     return roles;
 }
 
diff --git a/libnymea-common/types/browseritems.h b/libnymea-common/types/browseritems.h
index 07257942..4429b28e 100644
--- a/libnymea-common/types/browseritems.h
+++ b/libnymea-common/types/browseritems.h
@@ -15,9 +15,12 @@ public:
         RoleId,
         RoleDisplayName,
         RoleDescription,
+        RoleIcon,
         RoleThumbnail,
         RoleBrowsable,
-        RoleExecutable
+        RoleExecutable,
+
+        RoleMediaIcon,
     };
     Q_ENUM(Roles)
 
diff --git a/nymea-app/images.qrc b/nymea-app/images.qrc
index 37db3d92..03374bf9 100644
--- a/nymea-app/images.qrc
+++ b/nymea-app/images.qrc
@@ -182,5 +182,31 @@
         <file>ui/images/lock-open.svg</file>
         <file>ui/images/system-update.svg</file>
         <file>ui/images/folder-symbolic.svg</file>
+        <file>ui/images/browser/BrowserIconFile.svg</file>
+        <file>ui/images/browser/BrowserIconFolder.svg</file>
+        <file>ui/images/browser/MediaBrowserIconSpotify.svg</file>
+        <file>ui/images/browser/MediaBrowserIconAirable.svg</file>
+        <file>ui/images/browser/MediaBrowserIconAmazon.svg</file>
+        <file>ui/images/browser/MediaBrowserIconAux.svg</file>
+        <file>ui/images/browser/MediaBrowserIconLibrary.svg</file>
+        <file>ui/images/browser/MediaBrowserIconMusicLibrary.svg</file>
+        <file>ui/images/browser/MediaBrowserIconNetwork.svg</file>
+        <file>ui/images/browser/MediaBrowserIconPictureLibrary.svg</file>
+        <file>ui/images/browser/MediaBrowserIconPlaylist.svg</file>
+        <file>ui/images/browser/MediaBrowserIconRecentlyPlayed.svg</file>
+        <file>ui/images/browser/MediaBrowserIconSiriusXM.svg</file>
+        <file>ui/images/browser/MediaBrowserIconTidal.svg</file>
+        <file>ui/images/browser/MediaBrowserIconTuneIn.svg</file>
+        <file>ui/images/browser/MediaBrowserIconUSB.svg</file>
+        <file>ui/images/browser/MediaBrowserIconVideoLibrary.svg</file>
+        <file>ui/images/browser/MediaBrowserIconVTuner.svg</file>
+        <file>ui/images/browser/MediaBrowserIconDisk.svg</file>
+        <file>ui/images/browser/BrowserIconFavorites.svg</file>
+        <file>ui/images/browser/BrowserIconMusic.svg</file>
+        <file>ui/images/browser/BrowserIconPicture.svg</file>
+        <file>ui/images/browser/BrowserIconVideo.svg</file>
+        <file>ui/images/browser/BrowserIconApplication.svg</file>
+        <file>ui/images/browser/BrowserIconDocument.svg</file>
+        <file>ui/images/browser/BrowserIconPackage.svg</file>
     </qresource>
 </RCC>
diff --git a/nymea-app/ui/components/MainPageTile.qml b/nymea-app/ui/components/MainPageTile.qml
index 9b31d484..cd0a3c0c 100644
--- a/nymea-app/ui/components/MainPageTile.qml
+++ b/nymea-app/ui/components/MainPageTile.qml
@@ -9,6 +9,7 @@ Item {
     property alias iconName: colorIcon.name
     property alias fallbackIconName: fallbackIcon.name
     property alias iconColor: colorIcon.color
+    property alias backgroundImage: background.source
     property string text
     property bool disconnected: false
     property bool batteryCritical: false
@@ -24,6 +25,19 @@ Item {
         Material.elevation: 1
         padding: 0
 
+        Image {
+            id: background
+            anchors.fill: parent
+            anchors.margins: 1
+            z: -1
+//            opacity: .5
+//            Rectangle {
+//                anchors.fill: parent
+//                color: Material.background
+//                opacity: .5
+//            }
+        }
+
         contentItem: ItemDelegate {
             padding: 0; topPadding: 0; bottomPadding: 0
             onClicked: root.clicked()
@@ -35,6 +49,7 @@ Item {
                     Layout.fillHeight: true
                     Layout.margins: app.margins
                     Item {
+                        visible: background.status !== Image.Ready
                         Layout.fillWidth: true
                         Layout.fillHeight: true
 
@@ -55,6 +70,7 @@ Item {
                     Item {
                         Layout.fillWidth: true
                         Layout.fillHeight: true
+                        visible: background.status !== Image.Ready
 
                         Label {
                             id: label
@@ -77,6 +93,11 @@ Item {
                     Layout.preferredHeight: app.iconSize + app.margins * 2
                     visible: root.contentItem.length > 1
 
+                    Rectangle {
+                        anchors.fill: parent
+                        color: Material.background
+                    }
+
                     Rectangle {
                         anchors.fill: parent
                         color: Material.foreground
diff --git a/nymea-app/ui/components/NymeaListItemDelegate.qml b/nymea-app/ui/components/NymeaListItemDelegate.qml
index 1ac96205..b0768229 100644
--- a/nymea-app/ui/components/NymeaListItemDelegate.qml
+++ b/nymea-app/ui/components/NymeaListItemDelegate.qml
@@ -15,6 +15,7 @@ SwipeDelegate {
     property bool prominentSubText: true
 
     property string iconName
+    property string fallbackIcon
     property int iconSize: app.iconSize
     property color iconColor: app.accentColor
     property alias iconKeyColor: icon.keyColor
@@ -32,14 +33,27 @@ SwipeDelegate {
     contentItem: RowLayout {
         id: innerLayout
         spacing: app.margins
-        ColorIcon {
-            id: icon
+        Item {
             Layout.preferredHeight: root.iconSize
             Layout.preferredWidth: height
-            name: root.iconName
-            color: root.iconColor
-            visible: root.iconName
+            visible: root.iconName || root.fallbackIcon
+
+            ColorIcon {
+                id: icon
+                anchors.fill: parent
+                name: root.iconName
+                color: root.iconColor
+                visible: root.iconName
+            }
+
+            ColorIcon {
+                anchors.fill: parent
+                name: root.fallbackIcon
+                color: root.iconColor
+                visible: root.fallbackIcon && (!root.iconName || icon.status === Image.Error)
+            }
         }
+
         ColumnLayout {
             Layout.fillWidth: true
             Layout.fillHeight: true
diff --git a/nymea-app/ui/devicepages/DeviceBrowserPage.qml b/nymea-app/ui/devicepages/DeviceBrowserPage.qml
index c53a6366..535234cc 100644
--- a/nymea-app/ui/devicepages/DeviceBrowserPage.qml
+++ b/nymea-app/ui/devicepages/DeviceBrowserPage.qml
@@ -6,7 +6,7 @@ import "../components"
 
 Page {
     id: root
-    header: GuhHeader {
+    header: NymeaHeader {
         text: qsTr("Browse %1").arg(root.device.name)
         onBackPressed: pageStack.pop()
     }
@@ -26,14 +26,17 @@ Page {
         id: listView
         anchors.fill: parent
         model: d.model
+        ScrollBar.vertical: ScrollBar {}
 
-        delegate: MeaListItemDelegate {
+        delegate: NymeaListItemDelegate {
             width: parent.width
             text: model.displayName
             progressive: model.browsable
             subText: model.description
             prominentSubText: false
             iconName: model.thumbnail
+            fallbackIcon: "../images/browser/" + model.icon + ".svg"
+            enabled: model.browsable || model.executable
 
             onClicked: {
                 print("clicked:", model.id)
diff --git a/nymea-app/ui/devicepages/DevicePageBase.qml b/nymea-app/ui/devicepages/DevicePageBase.qml
index 40621a1c..478e609a 100644
--- a/nymea-app/ui/devicepages/DevicePageBase.qml
+++ b/nymea-app/ui/devicepages/DevicePageBase.qml
@@ -11,16 +11,25 @@ Page {
 
     property bool showLogsButton: true
     property bool showDetailsButton: true
+    property bool showBrowserButton: true
+    property bool popStackOnBackButton: true
 
     default property alias data: contentItem.data
 
+    signal backPressed()
+
     header: NymeaHeader {
         text: device.name
-        onBackPressed: pageStack.pop()
+        onBackPressed: {
+            root.backPressed();
+            if (root.popStackOnBackButton) {
+                pageStack.pop()
+            }
+        }
 
         HeaderButton {
             imageSource: "../images/folder-symbolic.svg"
-            visible: root.deviceClass.browsable
+            visible: root.deviceClass.browsable && root.showBrowserButton
             onClicked: {
                 pageStack.push(Qt.resolvedUrl("DeviceBrowserPage.qml"), {device: root.device})
             }
diff --git a/nymea-app/ui/devicepages/MediaDevicePage.qml b/nymea-app/ui/devicepages/MediaDevicePage.qml
index 8d0695a6..33b8ec23 100644
--- a/nymea-app/ui/devicepages/MediaDevicePage.qml
+++ b/nymea-app/ui/devicepages/MediaDevicePage.qml
@@ -9,6 +9,20 @@ import "../customviews"
 
 DevicePageBase {
     id: root
+    popStackOnBackButton: false
+    showBrowserButton: false
+
+    onBackPressed: {
+        if (swipeView.currentIndex > 0) {
+            if (internalPageStack.depth > 1) {
+                internalPageStack.pop();
+            } else {
+                swipeView.currentIndex = 0;
+            }
+        } else {
+            pageStack.pop();
+        }
+    }
 
     function stateValue(name) {
         var stateType = root.deviceClass.stateTypes.findByName(name);
@@ -24,132 +38,197 @@ DevicePageBase {
 
     readonly property State playbackState: device.states.getState(deviceClass.stateTypes.findByName("playbackStatus").id)
 
-    GridLayout {
-        id: contentColumn
+    SwipeView {
+        id: swipeView
         anchors.fill: parent
-        anchors.margins: app.margins
-        columns: app.landscape ? 2 : 1
-        columnSpacing: app.margins
-        rowSpacing: app.margins
 
-        Pane {
-            Layout.fillWidth: true
-            Layout.fillHeight: true
-            Material.elevation: 2
-            padding: 0
+        Item {
+            GridLayout {
+                id: contentColumn
+                anchors.fill: parent
+                anchors.margins: app.margins
+                columns: app.landscape ? 2 : 1
+                columnSpacing: app.margins
+                rowSpacing: app.margins
 
-            contentItem: Rectangle {
-                color: app.foregroundColor
+                Pane {
+                    Layout.fillWidth: true
+                    Layout.fillHeight: true
+                    Layout.minimumWidth: parent.width / 2
+                    Material.elevation: 2
+                    padding: 0
 
-                Image {
-                    id: artworkImage
-                    anchors.fill: parent
-                    fillMode: Image.PreserveAspectFit
-                    source: root.stateValue("artwork")
-                }
+                    contentItem: Rectangle {
+                        color: app.foregroundColor
 
-                ColorIcon {
-                    id: fallback
-                    anchors.fill: parent
-                    anchors.margins: app.margins * 2
-                    name: root.stateValue("playerType") === "video" ? "../images/stock_video.svg" : "../images/stock_music.svg"
-                    visible: artworkImage.status !== Image.Ready || artworkImage.source === ""
-                    color: app.primaryColor
-                }
-            }
-        }
+                        Image {
+                            id: artworkImage
+                            anchors.fill: parent
+                            fillMode: Image.PreserveAspectFit
+                            source: root.stateValue("artwork")
+                        }
 
-        ColumnLayout {
-            Layout.fillWidth: true
-            spacing: app.margins
-
-            Label {
-                Layout.fillWidth: true
-                horizontalAlignment: Text.AlignHCenter
-                wrapMode: Text.WordWrap
-                maximumLineCount: 2
-                elide: Text.ElideRight
-                font.pixelSize: app.largeFont
-                font.bold: true
-                text: root.stateValue("title")
-            }
-            Label {
-                Layout.fillWidth: true
-                horizontalAlignment: Text.AlignHCenter
-                wrapMode: Text.WordWrap
-                maximumLineCount: 2
-                elide: Text.ElideRight
-                text: root.stateValue("artist")
-            }
-            Label {
-                Layout.fillWidth: true
-                horizontalAlignment: Text.AlignHCenter
-                wrapMode: Text.WordWrap
-                maximumLineCount: 2
-                elide: Text.ElideRight
-                text: root.stateValue("collection")
-            }
-
-            RowLayout {
-                Layout.fillWidth: true
-                Item { Layout.fillWidth: true }
-
-                ProgressButton {
-                    Layout.preferredHeight: app.iconSize
-                    Layout.preferredWidth: height
-                    imageSource: "../images/media-skip-backward.svg"
-                    longpressImageSource: "../images/media-seek-backward.svg"
-                    repeat: true
-
-                    onClicked: {
-                        root.executeAction("skipBack")
-                    }
-                    onLongpressed: {
-                        root.executeAction("fastRewind")
-                    }
-                }
-
-                Item { Layout.fillWidth: true }
-
-                ProgressButton {
-                    Layout.preferredHeight: app.iconSize * 2
-                    Layout.preferredWidth: height
-                    imageSource: root.playbackState.value === "Playing" ? "../images/media-playback-pause.svg" : "../images/media-playback-start.svg"
-                    longpressImageSource: "../images/media-playback-stop.svg"
-                    longpressEnabled: root.playbackState.value !== "Stopped"
-
-                    onClicked: {
-                        if (root.playbackState.value === "Playing") {
-                            root.executeAction("pause")
-                        } else {
-                            root.executeAction("play")
+                        ColorIcon {
+                            id: fallback
+                            anchors.fill: parent
+                            anchors.margins: app.margins * 2
+                            name: root.stateValue("playerType") === "video" ? "../images/stock_video.svg" : "../images/stock_music.svg"
+                            visible: artworkImage.status !== Image.Ready || artworkImage.source === ""
+                            color: app.primaryColor
                         }
                     }
-
-                    onLongpressed: {
-                        root.executeAction("stop")
-                    }
                 }
 
-                Item { Layout.fillWidth: true }
-                ProgressButton {
-                    Layout.preferredHeight: app.iconSize
-                    Layout.preferredWidth: height
-                    imageSource: "../images/media-skip-forward.svg"
-                    longpressImageSource: "../images/media-seek-forward.svg"
-                    repeat: true
-                    onClicked: {
-                        root.executeAction("skipNext")
+                ColumnLayout {
+                    Layout.fillWidth: true
+                    spacing: app.margins
+
+                    Label {
+                        Layout.fillWidth: true
+                        horizontalAlignment: Text.AlignHCenter
+                        wrapMode: Text.WordWrap
+                        maximumLineCount: 2
+                        elide: Text.ElideRight
+                        font.pixelSize: app.largeFont
+                        font.bold: true
+                        text: root.stateValue("title")
                     }
-                    onLongpressed: {
-                        root.executeAction("fastForward")
+                    Label {
+                        Layout.fillWidth: true
+                        horizontalAlignment: Text.AlignHCenter
+                        wrapMode: Text.WordWrap
+                        maximumLineCount: 2
+                        elide: Text.ElideRight
+                        text: root.stateValue("artist")
+                    }
+                    Label {
+                        Layout.fillWidth: true
+                        horizontalAlignment: Text.AlignHCenter
+                        wrapMode: Text.WordWrap
+                        maximumLineCount: 2
+                        elide: Text.ElideRight
+                        text: root.stateValue("collection")
+                    }
+
+                    RowLayout {
+                        Layout.fillWidth: true
+                        Item { Layout.fillWidth: true }
+
+                        ProgressButton {
+                            Layout.preferredHeight: app.iconSize
+                            Layout.preferredWidth: height
+                            imageSource: "../images/media-skip-backward.svg"
+                            longpressImageSource: "../images/media-seek-backward.svg"
+                            repeat: true
+
+                            onClicked: {
+                                root.executeAction("skipBack")
+                            }
+                            onLongpressed: {
+                                root.executeAction("fastRewind")
+                            }
+                        }
+
+                        Item { Layout.fillWidth: true }
+
+                        ProgressButton {
+                            Layout.preferredHeight: app.iconSize * 2
+                            Layout.preferredWidth: height
+                            imageSource: root.playbackState.value === "Playing" ? "../images/media-playback-pause.svg" : "../images/media-playback-start.svg"
+                            longpressImageSource: "../images/media-playback-stop.svg"
+                            longpressEnabled: root.playbackState.value !== "Stopped"
+
+                            onClicked: {
+                                if (root.playbackState.value === "Playing") {
+                                    root.executeAction("pause")
+                                } else {
+                                    root.executeAction("play")
+                                }
+                            }
+
+                            onLongpressed: {
+                                root.executeAction("stop")
+                            }
+                        }
+
+                        Item { Layout.fillWidth: true }
+                        ProgressButton {
+                            Layout.preferredHeight: app.iconSize
+                            Layout.preferredWidth: height
+                            imageSource: "../images/media-skip-forward.svg"
+                            longpressImageSource: "../images/media-seek-forward.svg"
+                            repeat: true
+                            onClicked: {
+                                root.executeAction("skipNext")
+                            }
+                            onLongpressed: {
+                                root.executeAction("fastForward")
+                            }
+                        }
+                        Item { Layout.fillWidth: true }
                     }
                 }
-                Item { Layout.fillWidth: true }
             }
         }
+
+        Item {
+
+            StackView {
+                id: internalPageStack
+                anchors.fill: parent
+                initialItem: internalBrowserPage
+
+                Component {
+                    id: internalBrowserPage
+                    ListView {
+                        id: listView
+                        anchors.fill: parent
+                        model: browserItems
+                        ScrollBar.vertical: ScrollBar {}
+
+                        property string nodeId: ""
+
+                        // Need to keep a explicit property here or the GC will eat it too early
+                        property BrowserItems browserItems: null
+                        Component.onCompleted: {
+                            browserItems = engine.deviceManager.browseDevice(root.device.id, nodeId);
+                        }
+
+                        delegate: NymeaListItemDelegate {
+                            width: parent.width
+                            text: model.displayName
+                            progressive: model.browsable
+                            subText: model.description
+                            prominentSubText: false
+                            iconName: model.thumbnail
+                            fallbackIcon: "../images/browser/" + (model.mediaIcon && model.mediaIcon !== "MediaBrowserIconNone" ? model.mediaIcon : model.icon) + ".svg"
+                            enabled: model.browsable || model.executable
+
+                            onClicked: {
+                                print("clicked:", model.id)
+                                if (model.executable) {
+                                    engine.deviceManager.executeBrowserItem(root.device.id, model.id)
+                                } else if (model.browsable) {
+                                    internalPageStack.push(internalBrowserPage, {device: root.device, nodeId: model.id})
+                                }
+                            }
+                        }
+
+                        BusyIndicator {
+                            anchors.centerIn: parent
+                            running: listView.model.busy
+                            visible: running
+                        }
+                    }
+                }
+
+            }
+
+
+        }
     }
 
+
     Component {
         id: volumeSliderPaneComponent
         Dialog {
@@ -158,6 +237,7 @@ DevicePageBase {
             topPadding: app.margins / 2
             rightPadding: 0
             bottomPadding: app.margins / 2
+            modal: true
 
             contentItem: ColumnLayout {
                 Slider {
@@ -193,71 +273,102 @@ DevicePageBase {
 
     footer: Pane {
         Material.elevation: 1
-        height: 50
+        height: 52
         padding: 0
-        contentItem: RowLayout {
-//            Item {
-//                Layout.fillWidth: true; Layout.fillHeight: true
-//                HeaderButton {
-//                    anchors.centerIn: parent
-//                    imageSource: "../images/media-playlist.svg"
-//                }
-//            }
+        contentItem: ColumnLayout {
             Item {
-                Layout.fillWidth: true; Layout.fillHeight: true
-                visible: root.deviceClass.interfaces.indexOf("shufflerepeat") >= 0
-                HeaderButton {
-                    anchors.centerIn: parent
-                    imageSource: root.stateValue("repeat") === "One" ? "../images/media-playlist-repeat-one.svg" : "../images/media-playlist-repeat.svg"
-                    color: root.stateValue("repeat") === "None" ? keyColor : app.accentColor
-                    property var allowedValues: ["None", "All", "One"]
-                    onClicked: {
-                        var params = []
-                        var param = {}
-                        param["paramTypeId"] = root.deviceClass.actionTypes.findByName("repeat").id;
-                        param["value"] = allowedValues[(allowedValues.indexOf(root.stateValue("repeat")) + 1) % 3]
-                        params.push(param)
-                        root.executeAction("repeat", params)
-                    }
+                Layout.fillWidth: true
+                Layout.preferredHeight: 2
+                Rectangle {
+                    height: parent.height
+                    width: parent.width / 2
+                    color: app.accentColor
+                    x: swipeView.currentIndex * width
+                    Behavior on x { NumberAnimation { duration: 150 } }
                 }
             }
-            Item {
-                Layout.fillWidth: true; Layout.fillHeight: true
-                visible: root.deviceClass.interfaces.indexOf("shufflerepeat") >= 0
-                HeaderButton {
-                    anchors.centerIn: parent
-                    imageSource: "../images/media-playlist-shuffle.svg"
-                    color: root.stateValue("shuffle") ? app.accentColor: keyColor
-                    onClicked: {
-                        var params = []
-                        var param = {}
-                        param["paramTypeId"] = root.deviceClass.actionTypes.findByName("shuffle").id;
-                        param["value"] = !root.stateValue("shuffle")
-                        params.push(param)
-                        root.executeAction("shuffle", params)
+
+            RowLayout {
+                Item {
+                    Layout.fillHeight: true
+                    Layout.preferredWidth: root.deviceClass.browsable && swipeView.currentIndex > 0 ? parent.width / 4 : 0
+                    Behavior on Layout.preferredWidth { NumberAnimation {} }
+                    HeaderButton {
+                        anchors.centerIn: parent
+                        imageSource: "../images/back.svg"
+                        opacity:  root.deviceClass.browsable && swipeView.currentIndex == 1 ? 1 : 0
+                        Behavior on opacity { NumberAnimation {} }
+                        onClicked: swipeView.currentIndex = 0
                     }
                 }
-            }
-            Item {
-                id: volumeButtonContainer
-                Layout.fillWidth: true; Layout.fillHeight: true
-                HeaderButton {
-                    id: volumeButton
-                    anchors.centerIn: parent
-                    imageSource: "../images/audio-speakers-symbolic.svg"
-                    onClicked: {
-                        print("...");
-                        print(volumeButton.x, volumeButton.y)
-                        print(Qt.point(volumeButton.x, volumeButton.y))
-                        print(volumeButton.mapToItem(root, volumeButton.x,0))
-                        var buttonPosition = root.mapFromItem(volumeButtonContainer, volumeButton.x, 0)
-                        var sliderHeight = 200
-                        var props = {}
-                        props["x"] = buttonPosition.x
-                        props["y"] = root.height - sliderHeight - root.footer.height
-                        props["height"] = sliderHeight
-                        var sliderPane = volumeSliderPaneComponent.createObject(root, props)
-                        sliderPane.open()
+                Item {
+                    Layout.fillWidth: true; Layout.fillHeight: true
+                    visible: root.deviceClass.interfaces.indexOf("shufflerepeat") >= 0
+                    HeaderButton {
+                        anchors.centerIn: parent
+                        imageSource: root.stateValue("repeat") === "One" ? "../images/media-playlist-repeat-one.svg" : "../images/media-playlist-repeat.svg"
+                        color: root.stateValue("repeat") === "None" ? keyColor : app.accentColor
+                        property var allowedValues: ["None", "All", "One"]
+                        onClicked: {
+                            var params = []
+                            var param = {}
+                            param["paramTypeId"] = root.deviceClass.actionTypes.findByName("repeat").id;
+                            param["value"] = allowedValues[(allowedValues.indexOf(root.stateValue("repeat")) + 1) % 3]
+                            params.push(param)
+                            root.executeAction("repeat", params)
+                        }
+                    }
+                }
+                Item {
+                    Layout.fillWidth: true; Layout.fillHeight: true
+                    visible: root.deviceClass.interfaces.indexOf("shufflerepeat") >= 0
+                    HeaderButton {
+                        anchors.centerIn: parent
+                        imageSource: "../images/media-playlist-shuffle.svg"
+                        color: root.stateValue("shuffle") ? app.accentColor: keyColor
+                        onClicked: {
+                            var params = []
+                            var param = {}
+                            param["paramTypeId"] = root.deviceClass.actionTypes.findByName("shuffle").id;
+                            param["value"] = !root.stateValue("shuffle")
+                            params.push(param)
+                            root.executeAction("shuffle", params)
+                        }
+                    }
+                }
+                Item {
+                    id: volumeButtonContainer
+                    Layout.fillWidth: true; Layout.fillHeight: true
+                    HeaderButton {
+                        id: volumeButton
+                        anchors.centerIn: parent
+                        imageSource: "../images/audio-speakers-symbolic.svg"
+                        onClicked: {
+                            print("...");
+                            print(volumeButton.x, volumeButton.y)
+                            print(Qt.point(volumeButton.x, volumeButton.y))
+                            print(volumeButton.mapToItem(root, volumeButton.x,0))
+                            var buttonPosition = root.mapFromItem(volumeButtonContainer, volumeButton.x, 0)
+                            var sliderHeight = 200
+                            var props = {}
+                            props["x"] = buttonPosition.x
+                            props["y"] = root.height - sliderHeight - root.footer.height
+                            props["height"] = sliderHeight
+                            var sliderPane = volumeSliderPaneComponent.createObject(root, props)
+                            sliderPane.open()
+                        }
+                    }
+                }
+                Item {
+                    Layout.fillHeight: true
+                    Layout.preferredWidth: root.deviceClass.browsable && swipeView.currentIndex == 0 ? parent.width / 4 : 0
+                    Behavior on Layout.preferredWidth { NumberAnimation {} }
+                    HeaderButton {
+                        anchors.centerIn: parent
+                        imageSource: "../images/next.svg"
+                        onClicked: swipeView.currentIndex = 1
+                        opacity:  root.deviceClass.browsable && swipeView.currentIndex == 0 ? 1 : 0
+                        Behavior on opacity { NumberAnimation {} }
                     }
                 }
             }
diff --git a/nymea-app/ui/images/browser/BrowserIconApplication.svg b/nymea-app/ui/images/browser/BrowserIconApplication.svg
new file mode 100644
index 00000000..87b3400d
--- /dev/null
+++ b/nymea-app/ui/images/browser/BrowserIconApplication.svg
@@ -0,0 +1,167 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="96"
+   height="96"
+   id="svg4874"
+   version="1.1"
+   inkscape:version="0.91 r13725"
+   viewBox="0 0 96 96.000001"
+   sodipodi:docname="stock_application04d.svg">
+  <defs
+     id="defs4876" />
+  <sodipodi:namedview
+     id="base"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageopacity="0.0"
+     inkscape:pageshadow="2"
+     inkscape:zoom="2.8774395"
+     inkscape:cx="-39.276042"
+     inkscape:cy="49.870684"
+     inkscape:document-units="px"
+     inkscape:current-layer="g4780"
+     showgrid="false"
+     showborder="true"
+     fit-margin-top="0"
+     fit-margin-left="0"
+     fit-margin-right="0"
+     fit-margin-bottom="0"
+     inkscape:snap-bbox="true"
+     inkscape:bbox-paths="true"
+     inkscape:bbox-nodes="true"
+     inkscape:snap-bbox-edge-midpoints="true"
+     inkscape:snap-bbox-midpoints="true"
+     inkscape:object-paths="true"
+     inkscape:snap-intersection-paths="true"
+     inkscape:object-nodes="true"
+     inkscape:snap-smooth-nodes="true"
+     inkscape:snap-midpoints="true"
+     inkscape:snap-object-midpoints="true"
+     inkscape:snap-center="true"
+     showguides="false"
+     inkscape:guide-bbox="true"
+     inkscape:snap-global="true">
+    <inkscape:grid
+       type="xygrid"
+       id="grid5451"
+       empspacing="8" />
+    <sodipodi:guide
+       orientation="1,0"
+       position="8,-8.0000001"
+       id="guide4063" />
+    <sodipodi:guide
+       orientation="1,0"
+       position="4,-8.0000001"
+       id="guide4065" />
+    <sodipodi:guide
+       orientation="0,1"
+       position="-8,88.000001"
+       id="guide4067" />
+    <sodipodi:guide
+       orientation="0,1"
+       position="-8,92.000001"
+       id="guide4069" />
+    <sodipodi:guide
+       orientation="0,1"
+       position="-5,8.0000001"
+       id="guide4073" />
+    <sodipodi:guide
+       orientation="-1,6.123234e-17"
+       position="88,-8.0000001"
+       id="guide4077" />
+    <sodipodi:guide
+       orientation="0,1"
+       position="-8,84.000001"
+       id="guide4074" />
+    <sodipodi:guide
+       orientation="1,0"
+       position="12,-8.0000001"
+       id="guide4076" />
+    <sodipodi:guide
+       orientation="1,0"
+       position="84,-8.0000001"
+       id="guide4080" />
+    <sodipodi:guide
+       position="48,-8.0000001"
+       orientation="1,0"
+       id="guide4170" />
+    <sodipodi:guide
+       position="-8,48"
+       orientation="0,1"
+       id="guide4172" />
+    <sodipodi:guide
+       position="92,-8.0000001"
+       orientation="1,0"
+       id="guide4760" />
+    <sodipodi:guide
+       position="103,12"
+       orientation="0,1"
+       id="guide4206" />
+  </sodipodi:namedview>
+  <metadata
+     id="metadata4879">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title></dc:title>
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <g
+     inkscape:label="Layer 1"
+     inkscape:groupmode="layer"
+     id="layer1"
+     transform="translate(67.857146,-78.50504)">
+    <g
+       transform="matrix(0,-1,-1,0,373.50506,516.50504)"
+       id="g4845"
+       style="display:inline">
+      <g
+         inkscape:export-ydpi="90"
+         inkscape:export-xdpi="90"
+         inkscape:export-filename="next01.png"
+         transform="matrix(-0.9996045,0,0,1,575.94296,-611.00001)"
+         id="g4778"
+         inkscape:label="Layer 1">
+        <g
+           transform="matrix(-1,0,0,1,575.99999,611)"
+           id="g4780"
+           style="display:inline">
+          <path
+             style="color:#000000;font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:medium;line-height:normal;font-family:sans-serif;text-indent:0;text-align:start;text-decoration:none;text-decoration-line:none;text-decoration-style:solid;text-decoration-color:#000000;letter-spacing:normal;word-spacing:normal;text-transform:none;direction:ltr;block-progression:tb;writing-mode:lr-tb;baseline-shift:baseline;text-anchor:start;white-space:normal;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;opacity:1;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;fill:#808080;fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:16.00316429;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker:none;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate"
+             d="M 43.033203 8 C 35.250484 24.47567 28.618983 39.253149 23.072266 52 L 35.111328 52 C 40.040151 40.312853 45.664646 27.27057 51.939453 13.251953 C 58.329407 26.949689 64.047621 40.107692 69.011719 52 L 73.75 52 C 68.209735 38.675566 61.667225 23.637294 54.292969 8.0136719 C 54.294969 8.0086739 54.298781 8.0046981 54.300781 8 L 43.033203 8 z M 15.380859 70 C 12.370121 77.190289 9.8584433 83.346665 8 88 L 20.34375 88 C 22.338134 82.984379 24.809599 76.856258 27.621094 70 L 15.380859 70 z M 76.349609 70 C 79.087239 76.884331 81.469123 83.042129 83.341797 88 L 88.017578 88 C 86.185539 83.125868 83.81163 76.957042 81.056641 70 L 76.349609 70 z "
+             transform="matrix(0,-1,-1.0003957,0,438.00245,441.36222)"
+             id="path4177" />
+          <rect
+             style="color:#000000;display:inline;overflow:visible;visibility:visible;fill:none;stroke:none;stroke-width:4;marker:none;enable-background:accumulate"
+             id="rect4782"
+             width="96.037987"
+             height="96"
+             x="-438.00244"
+             y="345.36221"
+             transform="scale(-1,1)" />
+          <path
+             style="color:#000000;display:inline;overflow:visible;visibility:visible;opacity:1;fill:#808080;fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:1.00019777;stroke-linecap:round;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker:none;enable-background:accumulate"
+             d="M 16.001953,50 C 8.9995331,50 7.999996,50 8,57 c 4e-6,7 0.9995331,7 8.001953,7 l 63.996094,0 c 7.00241,0 8.001949,4e-6 8.001953,-7 4e-6,-7.000004 -0.999543,-7 -8.001953,-7 z M 15,54 49,54 c 2.00082,0 3.000004,-4e-6 3,3 -4e-6,3.000004 -0.99918,3 -3,3 l -34,0 c -2.00083,0 -3.000004,4e-6 -3,-3 4e-6,-3.000004 0.99917,-3 3,-3 z"
+             transform="matrix(0,-1,-1.0003957,0,438.00245,441.36222)"
+             id="rect4188"
+             inkscape:connector-curvature="0"
+             sodipodi:nodetypes="szsszsssszsszs" />
+        </g>
+      </g>
+    </g>
+  </g>
+</svg>
diff --git a/nymea-app/ui/images/browser/BrowserIconDocument.svg b/nymea-app/ui/images/browser/BrowserIconDocument.svg
new file mode 100644
index 00000000..4110f70e
--- /dev/null
+++ b/nymea-app/ui/images/browser/BrowserIconDocument.svg
@@ -0,0 +1,177 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="90"
+   height="90"
+   id="svg4874"
+   version="1.1"
+   inkscape:version="0.48+devel r"
+   viewBox="0 0 90 90.000001"
+   sodipodi:docname="text-x-generic-symbolic.svg">
+  <defs
+     id="defs4876" />
+  <sodipodi:namedview
+     id="base"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageopacity="0.0"
+     inkscape:pageshadow="2"
+     inkscape:zoom="3.259629"
+     inkscape:cx="5.0926006"
+     inkscape:cy="70.49882"
+     inkscape:document-units="px"
+     inkscape:current-layer="g5283"
+     showgrid="true"
+     showborder="true"
+     fit-margin-top="0"
+     fit-margin-left="0"
+     fit-margin-right="0"
+     fit-margin-bottom="0"
+     inkscape:snap-bbox="true"
+     inkscape:bbox-paths="true"
+     inkscape:bbox-nodes="true"
+     inkscape:snap-bbox-edge-midpoints="true"
+     inkscape:snap-bbox-midpoints="true"
+     inkscape:object-paths="true"
+     inkscape:snap-intersection-paths="true"
+     inkscape:object-nodes="true"
+     inkscape:snap-smooth-nodes="true"
+     inkscape:snap-midpoints="true"
+     inkscape:snap-object-midpoints="true"
+     inkscape:snap-center="true"
+     showguides="true"
+     inkscape:guide-bbox="true">
+    <inkscape:grid
+       type="xygrid"
+       id="grid5451"
+       empspacing="6" />
+    <sodipodi:guide
+       orientation="1,0"
+       position="6,77"
+       id="guide4063" />
+    <sodipodi:guide
+       orientation="1,0"
+       position="3,78"
+       id="guide4065" />
+    <sodipodi:guide
+       orientation="0,1"
+       position="55,84"
+       id="guide4067" />
+    <sodipodi:guide
+       orientation="0,1"
+       position="53,87"
+       id="guide4069" />
+    <sodipodi:guide
+       orientation="0,1"
+       position="20,3"
+       id="guide4071" />
+    <sodipodi:guide
+       orientation="0,1"
+       position="20,6"
+       id="guide4073" />
+    <sodipodi:guide
+       orientation="1,0"
+       position="87,7"
+       id="guide4075" />
+    <sodipodi:guide
+       orientation="1,0"
+       position="84,7"
+       id="guide4077" />
+    <sodipodi:guide
+       orientation="0,1"
+       position="58,81"
+       id="guide4074" />
+    <sodipodi:guide
+       orientation="1,0"
+       position="9,74"
+       id="guide4076" />
+    <sodipodi:guide
+       orientation="0,1"
+       position="21,9"
+       id="guide4078" />
+    <sodipodi:guide
+       orientation="1,0"
+       position="81,4"
+       id="guide4080" />
+  </sodipodi:namedview>
+  <metadata
+     id="metadata4879">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title></dc:title>
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <g
+     inkscape:label="Layer 1"
+     inkscape:groupmode="layer"
+     id="layer1"
+     transform="translate(67.857146,-84.50504)">
+    <g
+       transform="matrix(0,-1,-1,0,373.50506,516.50504)"
+       id="g4845"
+       style="display:inline">
+      <g
+         id="g5283"
+         transform="matrix(0,-1,-1,0,-293.63782,2219.3622)">
+        <rect
+           y="-725.63782"
+           x="1778"
+           height="90"
+           width="90"
+           id="rect5285"
+           style="fill:none;stroke:none" />
+        <path
+           style="color:#000000;display:inline;overflow:visible;visibility:visible;fill:#808080;fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:4;marker:none;enable-background:accumulate"
+           d="m 9,3 0,84 51,0 3,0 18,-18 0,-3 0,-63 z m 6,6 60,0 0,57 -15,0 0,15 -45,0 z"
+           transform="translate(1778,-725.63782)"
+           id="path5289"
+           inkscape:connector-curvature="0"
+           sodipodi:nodetypes="ccccccccccccccc" />
+        <path
+           sodipodi:nodetypes="ccccc"
+           inkscape:connector-curvature="0"
+           id="rect5293"
+           d="m 1802,-707.63781 42,0 0,3.99999 -42,0 z"
+           style="color:#000000;display:inline;overflow:visible;visibility:visible;fill:#808080;fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:6;marker:none;enable-background:accumulate" />
+        <path
+           style="color:#000000;display:inline;overflow:visible;visibility:visible;fill:#808080;fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:6;marker:none;enable-background:accumulate"
+           d="m 1802,-699.63781 42,0 0,3.99999 -42,0 z"
+           id="path4615"
+           inkscape:connector-curvature="0"
+           sodipodi:nodetypes="ccccc" />
+        <path
+           sodipodi:nodetypes="ccccc"
+           inkscape:connector-curvature="0"
+           id="path4617"
+           d="m 1802,-691.63781 42,0 0,3.99999 -42,0 z"
+           style="color:#000000;display:inline;overflow:visible;visibility:visible;fill:#808080;fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:6;marker:none;enable-background:accumulate" />
+        <path
+           style="color:#000000;display:inline;overflow:visible;visibility:visible;fill:#808080;fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:6;marker:none;enable-background:accumulate"
+           d="m 1802,-683.63781 42,0 0,3.99999 -42,0 z"
+           id="path4619"
+           inkscape:connector-curvature="0"
+           sodipodi:nodetypes="ccccc" />
+        <path
+           sodipodi:nodetypes="ccccc"
+           inkscape:connector-curvature="0"
+           id="path4621"
+           d="m 1802,-675.63781 21,0 0,3.99999 -21,0 z"
+           style="color:#000000;display:inline;overflow:visible;visibility:visible;fill:#808080;fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:6;marker:none;enable-background:accumulate" />
+      </g>
+    </g>
+  </g>
+</svg>
diff --git a/nymea-app/ui/images/browser/BrowserIconFavorites.svg b/nymea-app/ui/images/browser/BrowserIconFavorites.svg
new file mode 120000
index 00000000..2ff3eb55
--- /dev/null
+++ b/nymea-app/ui/images/browser/BrowserIconFavorites.svg
@@ -0,0 +1 @@
+../starred.svg
\ No newline at end of file
diff --git a/nymea-app/ui/images/browser/BrowserIconFile.svg b/nymea-app/ui/images/browser/BrowserIconFile.svg
new file mode 100644
index 00000000..aaa48e15
--- /dev/null
+++ b/nymea-app/ui/images/browser/BrowserIconFile.svg
@@ -0,0 +1,147 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="90"
+   height="90"
+   id="svg4874"
+   version="1.1"
+   inkscape:version="0.48+devel r"
+   viewBox="0 0 90 90.000001"
+   sodipodi:docname="empty-symbolic.svg">
+  <defs
+     id="defs4876" />
+  <sodipodi:namedview
+     id="base"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageopacity="0.0"
+     inkscape:pageshadow="2"
+     inkscape:zoom="9.9475982"
+     inkscape:cx="46.217185"
+     inkscape:cy="7.7254828"
+     inkscape:document-units="px"
+     inkscape:current-layer="g5283"
+     showgrid="true"
+     showborder="true"
+     fit-margin-top="0"
+     fit-margin-left="0"
+     fit-margin-right="0"
+     fit-margin-bottom="0"
+     inkscape:snap-bbox="true"
+     inkscape:bbox-paths="true"
+     inkscape:bbox-nodes="true"
+     inkscape:snap-bbox-edge-midpoints="true"
+     inkscape:snap-bbox-midpoints="true"
+     inkscape:object-paths="true"
+     inkscape:snap-intersection-paths="true"
+     inkscape:object-nodes="true"
+     inkscape:snap-smooth-nodes="true"
+     inkscape:snap-midpoints="true"
+     inkscape:snap-object-midpoints="true"
+     inkscape:snap-center="true"
+     showguides="true"
+     inkscape:guide-bbox="true">
+    <inkscape:grid
+       type="xygrid"
+       id="grid5451"
+       empspacing="6" />
+    <sodipodi:guide
+       orientation="1,0"
+       position="6,77"
+       id="guide4063" />
+    <sodipodi:guide
+       orientation="1,0"
+       position="3,78"
+       id="guide4065" />
+    <sodipodi:guide
+       orientation="0,1"
+       position="55,84"
+       id="guide4067" />
+    <sodipodi:guide
+       orientation="0,1"
+       position="53,87"
+       id="guide4069" />
+    <sodipodi:guide
+       orientation="0,1"
+       position="20,3"
+       id="guide4071" />
+    <sodipodi:guide
+       orientation="0,1"
+       position="20,6"
+       id="guide4073" />
+    <sodipodi:guide
+       orientation="1,0"
+       position="87,7"
+       id="guide4075" />
+    <sodipodi:guide
+       orientation="1,0"
+       position="84,7"
+       id="guide4077" />
+    <sodipodi:guide
+       orientation="0,1"
+       position="58,81"
+       id="guide4074" />
+    <sodipodi:guide
+       orientation="1,0"
+       position="9,74"
+       id="guide4076" />
+    <sodipodi:guide
+       orientation="0,1"
+       position="21,9"
+       id="guide4078" />
+    <sodipodi:guide
+       orientation="1,0"
+       position="81,4"
+       id="guide4080" />
+  </sodipodi:namedview>
+  <metadata
+     id="metadata4879">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title></dc:title>
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <g
+     inkscape:label="Layer 1"
+     inkscape:groupmode="layer"
+     id="layer1"
+     transform="translate(67.857146,-84.50504)">
+    <g
+       transform="matrix(0,-1,-1,0,373.50506,516.50504)"
+       id="g4845"
+       style="display:inline">
+      <g
+         id="g5283"
+         transform="matrix(0,-1,-1,0,-293.63782,2219.3622)">
+        <rect
+           y="-725.63782"
+           x="1778"
+           height="90"
+           width="90"
+           id="rect5285"
+           style="fill:none;stroke:none" />
+        <path
+           style="color:#000000;display:inline;overflow:visible;visibility:visible;fill:#808080;fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:4;marker:none;enable-background:accumulate"
+           d="m 9,3 0,84 51,0 3,0 18,-18 0,-3 0,-63 z m 6,6 60,0 0,57 -15,0 0,15 -45,0 z"
+           transform="translate(1778,-725.63782)"
+           id="path5289"
+           inkscape:connector-curvature="0"
+           sodipodi:nodetypes="ccccccccccccccc" />
+      </g>
+    </g>
+  </g>
+</svg>
diff --git a/nymea-app/ui/images/browser/BrowserIconFolder.svg b/nymea-app/ui/images/browser/BrowserIconFolder.svg
new file mode 100644
index 00000000..50289d3e
--- /dev/null
+++ b/nymea-app/ui/images/browser/BrowserIconFolder.svg
@@ -0,0 +1,17 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+<svg id="svg4874" width="96" height="96" version="1.1" viewBox="0 0 96 96" xmlns="http://www.w3.org/2000/svg" xmlns:cc="http://creativecommons.org/ns#" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#">
+ <metadata id="metadata4879">
+  <rdf:RDF>
+   <cc:Work rdf:about="">
+    <dc:format>image/svg+xml</dc:format>
+    <dc:type rdf:resource="http://purl.org/dc/dcmitype/StillImage"/>
+    <dc:title/>
+   </cc:Work>
+  </rdf:RDF>
+ </metadata>
+ <g id="layer1" transform="translate(67.857 -78.505)">
+  <rect id="rect4782" transform="rotate(90)" x="78.505" y="-28.143" width="96" height="96" style="color:#000000;fill:none"/>
+  <path id="path4643" d="m-47.869 86.504-0.01172 2e-3c-5.0328 0.05818-8.7136-0.12027-11.725 1.541-1.5055 0.83064-2.6968 2.2356-3.3555 3.9902-0.65866 1.7547-0.89648 3.8364-0.89648 6.4668v54.002c0 2.6304 0.23782 4.7121 0.89648 6.4668 0.65866 1.7546 1.85 3.1596 3.3555 3.9902 3.011 1.6613 6.6918 1.4848 11.725 1.543h0.01172 56.023 0.011719c5.0328-0.0582 8.7136 0.11832 11.725-1.543 1.5055-0.83064 2.6968-2.2356 3.3555-3.9902 0.65866-1.7547 0.89648-3.8364 0.89648-6.4668v-38c0-2.6333-0.24451-4.7263-0.91016-6.4883-0.66565-1.762-1.8593-3.1729-3.3691-4.0117-3.0197-1.6776-6.7207-1.5-11.721-1.5h-46c-5 0-8.701-0.17761-11.721 1.5-1.5098 0.8388-2.7035 2.2497-3.3691 4.0117-0.66565 1.762-0.91016 3.855-0.91016 6.4883v40h4v-40c0-2.3667 0.25549-4.0257 0.65234-5.0762 0.39685-1.0505 0.82821-1.5146 1.5684-1.9258 1.4803-0.82239 4.7793-0.99805 9.7793-0.99805h46c5 0 8.299 0.17566 9.7793 0.99805 0.74015 0.41119 1.1715 0.87528 1.5684 1.9258 0.39685 1.0505 0.65234 2.7095 0.65234 5.0762v38c0 2.3696-0.25037 4.0209-0.64062 5.0606-0.39025 1.0396-0.80933 1.4898-1.543 1.8945-1.4645 0.80804-4.7782 0.98616-9.8164 1.0449h-55.977-0.02344c-5.0383-0.0588-8.3519-0.23688-9.8164-1.0449-0.73364-0.40478-1.1508-0.85491-1.541-1.8945-0.39025-1.0396-0.64258-2.691-0.64258-5.0606v-54.002c0-2.3696 0.25232-4.0209 0.64258-5.0605 0.39025-1.0396 0.80738-1.4898 1.541-1.8945 1.4645-0.80804 4.7782-0.98616 9.8164-1.0449l20.172 2e-3 6 6 33.828-2e-3v-4l-32.172 2e-3 -6-6z" style="color-rendering:auto;color:#000000;dominant-baseline:auto;fill:#808080;font-feature-settings:normal;font-variant-alternates:normal;font-variant-caps:normal;font-variant-ligatures:normal;font-variant-numeric:normal;font-variant-position:normal;image-rendering:auto;isolation:auto;mix-blend-mode:normal;shape-padding:0;shape-rendering:auto;solid-color:#000000;text-decoration-color:#000000;text-decoration-line:none;text-decoration-style:solid;text-indent:0;text-orientation:mixed;text-transform:none;white-space:normal"/>
+ </g>
+</svg>
diff --git a/nymea-app/ui/images/browser/BrowserIconMusic.svg b/nymea-app/ui/images/browser/BrowserIconMusic.svg
new file mode 100644
index 00000000..b43bc37d
--- /dev/null
+++ b/nymea-app/ui/images/browser/BrowserIconMusic.svg
@@ -0,0 +1,173 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="96"
+   height="96"
+   id="svg4874"
+   version="1.1"
+   inkscape:version="0.91+devel r"
+   viewBox="0 0 96 96.000001"
+   sodipodi:docname="stock_music.svg">
+  <defs
+     id="defs4876" />
+  <sodipodi:namedview
+     id="base"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageopacity="0.0"
+     inkscape:pageshadow="2"
+     inkscape:zoom="8.7812488"
+     inkscape:cx="56.506765"
+     inkscape:cy="41.753728"
+     inkscape:document-units="px"
+     inkscape:current-layer="g4780"
+     showgrid="true"
+     showborder="true"
+     fit-margin-top="0"
+     fit-margin-left="0"
+     fit-margin-right="0"
+     fit-margin-bottom="0"
+     inkscape:snap-bbox="true"
+     inkscape:bbox-paths="true"
+     inkscape:bbox-nodes="true"
+     inkscape:snap-bbox-edge-midpoints="true"
+     inkscape:snap-bbox-midpoints="true"
+     inkscape:object-paths="true"
+     inkscape:snap-intersection-paths="true"
+     inkscape:object-nodes="true"
+     inkscape:snap-smooth-nodes="true"
+     inkscape:snap-midpoints="true"
+     inkscape:snap-object-midpoints="true"
+     inkscape:snap-center="true"
+     showguides="false"
+     inkscape:guide-bbox="true"
+     inkscape:snap-global="false">
+    <inkscape:grid
+       type="xygrid"
+       id="grid5451"
+       empspacing="8" />
+    <sodipodi:guide
+       orientation="1,0"
+       position="8,-8.0000001"
+       id="guide4063"
+       inkscape:locked="false" />
+    <sodipodi:guide
+       orientation="1,0"
+       position="4,-8.0000001"
+       id="guide4065"
+       inkscape:locked="false" />
+    <sodipodi:guide
+       orientation="0,1"
+       position="-8,88.000001"
+       id="guide4067"
+       inkscape:locked="false" />
+    <sodipodi:guide
+       orientation="0,1"
+       position="-8,92.000001"
+       id="guide4069"
+       inkscape:locked="false" />
+    <sodipodi:guide
+       orientation="0,1"
+       position="104,4"
+       id="guide4071"
+       inkscape:locked="false" />
+    <sodipodi:guide
+       orientation="0,1"
+       position="-5,8.0000001"
+       id="guide4073"
+       inkscape:locked="false" />
+    <sodipodi:guide
+       orientation="1,0"
+       position="88,-8.0000001"
+       id="guide4077"
+       inkscape:locked="false" />
+    <sodipodi:guide
+       orientation="0,1"
+       position="-8,84.000001"
+       id="guide4074"
+       inkscape:locked="false" />
+    <sodipodi:guide
+       orientation="1,0"
+       position="12,-8.0000001"
+       id="guide4076"
+       inkscape:locked="false" />
+    <sodipodi:guide
+       orientation="1,0"
+       position="84,-8.0000001"
+       id="guide4080"
+       inkscape:locked="false" />
+    <sodipodi:guide
+       position="48,-8.0000001"
+       orientation="1,0"
+       id="guide4170"
+       inkscape:locked="false" />
+    <sodipodi:guide
+       position="-8,48"
+       orientation="0,1"
+       id="guide4172"
+       inkscape:locked="false" />
+    <sodipodi:guide
+       position="92,-8.0000001"
+       orientation="1,0"
+       id="guide4760"
+       inkscape:locked="false" />
+  </sodipodi:namedview>
+  <metadata
+     id="metadata4879">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title />
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <g
+     inkscape:label="Layer 1"
+     inkscape:groupmode="layer"
+     id="layer1"
+     transform="translate(67.857146,-78.50504)">
+    <g
+       transform="matrix(0,-1,-1,0,373.50506,516.50504)"
+       id="g4845"
+       style="display:inline">
+      <g
+         inkscape:export-ydpi="90"
+         inkscape:export-xdpi="90"
+         inkscape:export-filename="next01.png"
+         transform="matrix(-0.9996045,0,0,1,575.94296,-611.00001)"
+         id="g4778"
+         inkscape:label="Layer 1">
+        <g
+           transform="matrix(-1,0,0,1,575.99999,611)"
+           id="g4780"
+           style="display:inline">
+          <path
+             inkscape:connector-curvature="0"
+             id="path4393"
+             d="m 434.94803,360.83478 c 0.0125,1.12499 -0.16349,2.62112 -0.46267,4.61114 l -5.32748,33.94069 c -1.70308,7.99492 -2.23261,7.99488 -8.98973,7.99488 h -13.23182 -42.13175 c 0.41314,0.58986 0.82896,1.17197 1.23767,1.78162 h -0.002 c 1.70285,2.54004 2.91458,5.24656 2.9146,8.88277 0,4.55464 -1.74495,7.27171 -4.04296,8.91596 -2.298,1.64421 -5.19476,2.18946 -7.43386,2.18946 -2.70005,0 -5.58147,-0.92217 -7.77745,-2.92125 -2.19598,-1.99908 -3.73443,-5.0725 -3.73449,-9.4916 0,-4.99015 1.39467,-8.50054 4.11712,-10.48487 2.14348,-1.56235 5.00648,-2.4256 8.53879,-2.73391 h 0.006 0.004 c 0.42854,-0.0432 0.86812,-0.0742 1.32161,-0.10147 0.69823,-0.0419 2.00489,-0.0332 2.00489,-0.0332 h 41.97951 c 5.99707,0 6.35516,3e-4 7.72278,-7.99684 l 3.95705,-25.9536 c 1.04913,-8.01156 0.3143,-8.01245 -4.1835,-8.01245 h -38.63347 c 0.41315,0.58987 0.82897,1.17198 1.23769,1.78163 h -0.002 c 1.70285,2.54004 2.91458,5.24655 2.91459,8.88277 0,4.55464 -1.74494,7.27171 -4.04294,8.91594 -2.29802,1.64423 -5.19477,2.18947 -7.43388,2.18947 -2.70004,0 -5.58147,-0.92217 -7.77745,-2.92125 -2.19598,-1.99909 -3.73442,-5.07248 -3.7345,-9.4916 0,-4.99014 1.39468,-8.50055 4.11714,-10.48486 2.14348,-1.56237 5.00647,-2.4256 8.53879,-2.73391 h 0.006 0.004 c 0.42856,-0.0432 0.86813,-0.0742 1.32163,-0.10148 0.69823,-0.0418 2.00488,-0.0331 2.00488,-0.0331 h 45.9775 11.97656 c 5.25982,0 7.00192,0.0341 7.03953,3.4091 z"
+             style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:15px;line-height:125%;font-family:Ubuntu;-inkscape-font-specification:Ubuntu;text-align:center;letter-spacing:0px;word-spacing:0px;writing-mode:lr-tb;text-anchor:middle;display:inline;fill:#808080;fill-opacity:1;stroke:none;stroke-width:3.33608699;enable-background:new" />
+          <rect
+             style="color:#000000;display:inline;overflow:visible;visibility:visible;fill:none;stroke:none;stroke-width:4;marker:none;enable-background:accumulate"
+             id="rect4782"
+             width="96.037987"
+             height="96"
+             x="-438.00244"
+             y="345.36221"
+             transform="scale(-1,1)" />
+        </g>
+      </g>
+    </g>
+  </g>
+</svg>
diff --git a/nymea-app/ui/images/browser/BrowserIconPackage.svg b/nymea-app/ui/images/browser/BrowserIconPackage.svg
new file mode 120000
index 00000000..22864336
--- /dev/null
+++ b/nymea-app/ui/images/browser/BrowserIconPackage.svg
@@ -0,0 +1 @@
+../plugin.svg
\ No newline at end of file
diff --git a/nymea-app/ui/images/browser/BrowserIconPicture.svg b/nymea-app/ui/images/browser/BrowserIconPicture.svg
new file mode 100644
index 00000000..19bb10c9
--- /dev/null
+++ b/nymea-app/ui/images/browser/BrowserIconPicture.svg
@@ -0,0 +1,175 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="96"
+   height="96"
+   id="svg4874"
+   version="1.1"
+   inkscape:version="0.91+devel r"
+   viewBox="0 0 96 96.000001"
+   sodipodi:docname="stock_image.svg">
+  <defs
+     id="defs4876" />
+  <sodipodi:namedview
+     id="base"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageopacity="0.0"
+     inkscape:pageshadow="2"
+     inkscape:zoom="5.6199992"
+     inkscape:cx="2.6423423"
+     inkscape:cy="65.68504"
+     inkscape:document-units="px"
+     inkscape:current-layer="g4780"
+     showgrid="true"
+     showborder="true"
+     fit-margin-top="0"
+     fit-margin-left="0"
+     fit-margin-right="0"
+     fit-margin-bottom="0"
+     inkscape:snap-bbox="true"
+     inkscape:bbox-paths="true"
+     inkscape:bbox-nodes="true"
+     inkscape:snap-bbox-edge-midpoints="true"
+     inkscape:snap-bbox-midpoints="true"
+     inkscape:object-paths="true"
+     inkscape:snap-intersection-paths="true"
+     inkscape:object-nodes="true"
+     inkscape:snap-smooth-nodes="true"
+     inkscape:snap-midpoints="true"
+     inkscape:snap-object-midpoints="true"
+     inkscape:snap-center="true"
+     showguides="true"
+     inkscape:guide-bbox="true"
+     inkscape:snap-global="true">
+    <inkscape:grid
+       type="xygrid"
+       id="grid5451"
+       empspacing="8" />
+    <sodipodi:guide
+       orientation="1,0"
+       position="8,-8.0000001"
+       id="guide4063" />
+    <sodipodi:guide
+       orientation="1,0"
+       position="4,-8.0000001"
+       id="guide4065" />
+    <sodipodi:guide
+       orientation="0,1"
+       position="-8,88.000001"
+       id="guide4067" />
+    <sodipodi:guide
+       orientation="0,1"
+       position="-8,92.000001"
+       id="guide4069" />
+    <sodipodi:guide
+       orientation="0,1"
+       position="104,4"
+       id="guide4071" />
+    <sodipodi:guide
+       orientation="0,1"
+       position="-5,8.0000001"
+       id="guide4073" />
+    <sodipodi:guide
+       orientation="1,0"
+       position="92,-8.0000001"
+       id="guide4075" />
+    <sodipodi:guide
+       orientation="1,0"
+       position="88,-8.0000001"
+       id="guide4077" />
+    <sodipodi:guide
+       orientation="0,1"
+       position="-8,84.000001"
+       id="guide4074" />
+    <sodipodi:guide
+       orientation="1,0"
+       position="12,-8.0000001"
+       id="guide4076" />
+    <sodipodi:guide
+       orientation="0,1"
+       position="-5,12"
+       id="guide4078" />
+    <sodipodi:guide
+       orientation="1,0"
+       position="84,-9.0000001"
+       id="guide4080" />
+    <sodipodi:guide
+       position="48,-8.0000001"
+       orientation="1,0"
+       id="guide4170" />
+    <sodipodi:guide
+       position="-8,48"
+       orientation="0,1"
+       id="guide4172" />
+  </sodipodi:namedview>
+  <metadata
+     id="metadata4879">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title></dc:title>
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <g
+     inkscape:label="Layer 1"
+     inkscape:groupmode="layer"
+     id="layer1"
+     transform="translate(67.857146,-78.50504)">
+    <g
+       transform="matrix(0,-1,-1,0,373.50506,516.50504)"
+       id="g4845"
+       style="display:inline">
+      <g
+         inkscape:export-ydpi="90"
+         inkscape:export-xdpi="90"
+         inkscape:export-filename="next01.png"
+         transform="matrix(-0.9996045,0,0,1,575.94296,-611.00001)"
+         id="g4778"
+         inkscape:label="Layer 1">
+        <g
+           transform="matrix(-1,0,0,1,575.99999,611)"
+           id="g4780"
+           style="display:inline">
+          <rect
+             style="color:#000000;display:inline;overflow:visible;visibility:visible;fill:none;stroke:none;stroke-width:4;marker:none;enable-background:accumulate"
+             id="rect4782"
+             width="96.037987"
+             height="96"
+             x="-438.00244"
+             y="345.36221"
+             transform="scale(-1,1)" />
+          <path
+             inkscape:connector-curvature="0"
+             id="path4527"
+             d="m 417.99457,375.36222 c 0,5.52284 -4.47892,10 -10.00397,10 -5.52503,0 -10.00397,-4.47716 -10.00397,-10 0,-5.52284 4.47894,-10 10.00397,-10 5.52505,0 10.00397,4.47715 10.00397,10 z"
+             style="color:#000000;display:inline;overflow:visible;visibility:visible;fill:#808080;fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:6;marker:none;enable-background:accumulate" />
+          <path
+             sodipodi:nodetypes="cccccccccc"
+             inkscape:connector-curvature="0"
+             id="rect4520"
+             d="m 429.99929,433.36135 -80.0299,0 0,-79.99824 80.0299,0 z m -4.00159,-3.99913 0,-72 -60.02374,0 0,72 z"
+             style="color:#000000;display:inline;overflow:visible;visibility:visible;fill:#808080;fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:4;marker:none;enable-background:accumulate" />
+          <path
+             style="color:#000000;display:inline;overflow:visible;visibility:visible;fill:#808080;fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:6;marker:none;enable-background:accumulate"
+             d="m 406.99022,403.98292 -33.01306,17.37932 0,-16.30902 0,-25.691 24.40093,12.84568 -6.87783,3.62069 15.48996,8.15433 z"
+             id="path4156"
+             inkscape:connector-curvature="0" />
+        </g>
+      </g>
+    </g>
+  </g>
+</svg>
diff --git a/nymea-app/ui/images/browser/BrowserIconVideo.svg b/nymea-app/ui/images/browser/BrowserIconVideo.svg
new file mode 100644
index 00000000..56c5a4f4
--- /dev/null
+++ b/nymea-app/ui/images/browser/BrowserIconVideo.svg
@@ -0,0 +1,164 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="96"
+   height="96"
+   id="svg4874"
+   version="1.1"
+   inkscape:version="0.91+devel r"
+   viewBox="0 0 96 96.000001"
+   sodipodi:docname="stock_video.svg">
+  <defs
+     id="defs4876" />
+  <sodipodi:namedview
+     id="base"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageopacity="0.0"
+     inkscape:pageshadow="2"
+     inkscape:zoom="7.024999"
+     inkscape:cx="32.83274"
+     inkscape:cy="55.067605"
+     inkscape:document-units="px"
+     inkscape:current-layer="g4780"
+     showgrid="true"
+     showborder="true"
+     fit-margin-top="0"
+     fit-margin-left="0"
+     fit-margin-right="0"
+     fit-margin-bottom="0"
+     inkscape:snap-bbox="true"
+     inkscape:bbox-paths="true"
+     inkscape:bbox-nodes="true"
+     inkscape:snap-bbox-edge-midpoints="true"
+     inkscape:snap-bbox-midpoints="true"
+     inkscape:object-paths="true"
+     inkscape:snap-intersection-paths="true"
+     inkscape:object-nodes="true"
+     inkscape:snap-smooth-nodes="true"
+     inkscape:snap-midpoints="true"
+     inkscape:snap-object-midpoints="true"
+     inkscape:snap-center="true"
+     showguides="true"
+     inkscape:guide-bbox="true"
+     inkscape:snap-global="true">
+    <inkscape:grid
+       type="xygrid"
+       id="grid5451"
+       empspacing="8" />
+    <sodipodi:guide
+       orientation="1,0"
+       position="8,-8.0000001"
+       id="guide4063" />
+    <sodipodi:guide
+       orientation="1,0"
+       position="4,-8.0000001"
+       id="guide4065" />
+    <sodipodi:guide
+       orientation="0,1"
+       position="-8,88.000001"
+       id="guide4067" />
+    <sodipodi:guide
+       orientation="0,1"
+       position="-8,92.000001"
+       id="guide4069" />
+    <sodipodi:guide
+       orientation="0,1"
+       position="104,4"
+       id="guide4071" />
+    <sodipodi:guide
+       orientation="0,1"
+       position="-5,8.0000001"
+       id="guide4073" />
+    <sodipodi:guide
+       orientation="1,0"
+       position="92,-8.0000001"
+       id="guide4075" />
+    <sodipodi:guide
+       orientation="1,0"
+       position="88,-8.0000001"
+       id="guide4077" />
+    <sodipodi:guide
+       orientation="0,1"
+       position="-8,84.000001"
+       id="guide4074" />
+    <sodipodi:guide
+       orientation="1,0"
+       position="12,-8.0000001"
+       id="guide4076" />
+    <sodipodi:guide
+       orientation="0,1"
+       position="-5,12"
+       id="guide4078" />
+    <sodipodi:guide
+       orientation="1,0"
+       position="84,-9.0000001"
+       id="guide4080" />
+    <sodipodi:guide
+       position="48,-8.0000001"
+       orientation="1,0"
+       id="guide4170" />
+    <sodipodi:guide
+       position="-8,48"
+       orientation="0,1"
+       id="guide4172" />
+  </sodipodi:namedview>
+  <metadata
+     id="metadata4879">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title></dc:title>
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <g
+     inkscape:label="Layer 1"
+     inkscape:groupmode="layer"
+     id="layer1"
+     transform="translate(67.857146,-78.50504)">
+    <g
+       transform="matrix(0,-1,-1,0,373.50506,516.50504)"
+       id="g4845"
+       style="display:inline">
+      <g
+         inkscape:export-ydpi="90"
+         inkscape:export-xdpi="90"
+         inkscape:export-filename="next01.png"
+         transform="matrix(-0.9996045,0,0,1,575.94296,-611.00001)"
+         id="g4778"
+         inkscape:label="Layer 1">
+        <g
+           transform="matrix(-1,0,0,1,575.99999,611)"
+           id="g4780"
+           style="display:inline">
+          <rect
+             style="color:#000000;display:inline;overflow:visible;visibility:visible;fill:none;stroke:none;stroke-width:4;marker:none;enable-background:accumulate"
+             id="rect4782"
+             width="96.037987"
+             height="96"
+             x="-438.00244"
+             y="345.36221"
+             transform="scale(-1,1)" />
+          <path
+             style="color:#000000;display:inline;overflow:visible;visibility:visible;opacity:1;fill:#808080;fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:4.00079155;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker:none;enable-background:accumulate"
+             d="M 4 11 L 4 85 L 8 85 L 8 81 L 16 81 L 16 81.001953 L 16 85 L 20 85 L 76 85 L 80 85 L 80 81.001953 L 80 81 L 88 81 L 88 85 L 92 85 L 92 11 L 88 11 L 88 15 L 80 15 L 80 14.998047 L 80 11 L 20 11 L 16 11 L 16 14.998047 L 16 15 L 8 15 L 8 11 L 4 11 z M 20 14.998047 L 76 14.998047 L 76 46 L 20 46 L 20 14.998047 z M 8 21 L 16 21 L 16 27 L 8 27 L 8 21 z M 80 21 L 88 21 L 88 27 L 80 27 L 80 21 z M 8 33 L 16 33 L 16 39 L 8 39 L 8 33 z M 80 33 L 88 33 L 88 39 L 80 39 L 80 33 z M 8 45 L 16 45 L 16 46 L 16 49.998047 L 16 51 L 8 51 L 8 45 z M 80 45 L 88 45 L 88 51 L 80 51 L 80 45 z M 20 49.998047 L 76 49.998047 L 76 81.001953 L 20 81.001953 L 20 49.998047 z M 8 57 L 16 57 L 16 63 L 8 63 L 8 57 z M 80 57 L 88 57 L 88 63 L 80 63 L 80 57 z M 8 69 L 16 69 L 16 75 L 8 75 L 8 69 z M 80 69 L 88 69 L 88 75 L 80 75 L 80 69 z "
+             transform="matrix(0,-1,-1.0003957,0,438.00245,441.36222)"
+             id="rect4175" />
+        </g>
+      </g>
+    </g>
+  </g>
+</svg>
diff --git a/nymea-app/ui/images/browser/MediaBrowserIconAirable.svg b/nymea-app/ui/images/browser/MediaBrowserIconAirable.svg
new file mode 100644
index 00000000..fa2c1016
--- /dev/null
+++ b/nymea-app/ui/images/browser/MediaBrowserIconAirable.svg
@@ -0,0 +1,67 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="96"
+   height="96"
+   viewBox="0 0 25.399999 25.400001"
+   version="1.1"
+   id="svg8"
+   inkscape:version="0.92.3 (2405546, 2018-03-11)"
+   sodipodi:docname="MediaBrowserIconAirable.svg">
+  <defs
+     id="defs2" />
+  <sodipodi:namedview
+     id="base"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageopacity="0.0"
+     inkscape:pageshadow="2"
+     inkscape:zoom="7.9195959"
+     inkscape:cx="12.366716"
+     inkscape:cy="58.901736"
+     inkscape:document-units="mm"
+     inkscape:current-layer="layer1"
+     showgrid="true"
+     units="px"
+     inkscape:window-width="2792"
+     inkscape:window-height="1698"
+     inkscape:window-x="88"
+     inkscape:window-y="44"
+     inkscape:window-maximized="1">
+    <inkscape:grid
+       type="xygrid"
+       id="grid815" />
+  </sodipodi:namedview>
+  <metadata
+     id="metadata5">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title></dc:title>
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <g
+     inkscape:label="Layer 1"
+     inkscape:groupmode="layer"
+     id="layer1"
+     transform="translate(0,-271.59998)">
+    <path
+       style="fill:#808080;stroke-width:0.99999994;fill-opacity:1"
+       d="m 11.71525,295.52375 c -1.262524,-0.11989 -2.4371381,-0.4226 -3.5766391,-0.92163 -2.6099423,-1.1429 -4.7863242,-3.38259 -5.8667202,-6.03684 -0.5848379,-1.43697 -0.8168005,-2.64908 -0.8168005,-4.268 0,-1.39185 0.1415035,-2.30393 0.5467858,-3.52369 0.5928209,-1.78477 1.4972102,-3.22603 2.8549395,-4.54952 1.7523449,-1.70825 3.912092,-2.75964 6.3667075,-3.09933 0.708043,-0.098 2.242325,-0.098 2.950328,0 2.454644,0.33969 4.614367,1.39108 6.366714,3.09933 1.850447,1.80391 2.975993,4.03339 3.330882,6.59832 0.09795,0.70787 0.09795,2.24224 0,2.95011 -0.288844,2.08749 -1.10284,3.97841 -2.416759,5.61406 -0.4613,0.574 -1.372438,1.45579 -1.95715,1.89409 -1.585855,1.1883 -3.380796,1.92764 -5.303196,2.18401 -0.587982,0.0789 -1.936303,0.1105 -2.479092,0.0588 z m 1.890855,-2.04923 c 3.174891,-0.32014 5.963496,-2.26436 7.37341,-5.14091 2.236351,-4.56229 0.338099,-10.07055 -4.244605,-12.31701 -4.562411,-2.23628 -10.0707499,-0.33799 -12.3170314,4.24469 -2.2363329,4.56228 -0.3381117,10.07052 4.244598,12.31702 0.9254842,0.45363 2.0768864,0.78989 3.0548574,0.89196 0.497425,0.0527 1.395772,0.0537 1.888771,0.0115 z m -2.166663,-1.10454 c -1.267125,-0.17879 -2.0726418,-0.82804 -2.3644136,-1.90552 -0.1028136,-0.37966 -0.1261256,-1.04757 -0.049167,-1.40809 0.22431,-1.05098 1.0612796,-1.77203 2.2883956,-1.971 0.141667,-0.0237 0.918737,-0.0415 1.726777,-0.0415 l 1.469232,-0.002 -0.01556,-0.64539 c -0.01422,-0.5897 -0.02443,-0.66495 -0.121124,-0.87264 -0.292338,-0.62858 -0.808637,-0.87023 -1.859396,-0.87023 -0.871493,0 -1.294407,0.14479 -1.748291,0.59862 -0.281877,0.28183 -0.178604,0.32417 -0.9285479,-0.38036 l -0.4997517,-0.46946 0.2155618,-0.22042 c 0.7805518,-0.79836 1.7869228,-1.12282 3.2888378,-1.06058 1.272886,0.053 2.054727,0.31738 2.674977,0.90517 0.242341,0.22966 0.333483,0.35368 0.481826,0.6556 0.329234,0.67017 0.317616,0.52169 0.335153,4.2755 l 0.01554,3.32935 h -0.90196 -0.902004 l -0.01165,-0.39094 -0.01172,-0.39091 -0.242123,0.2049 c -0.314741,0.26625 -0.719524,0.4766 -1.118274,0.58092 -0.365159,0.0956 -1.29879,0.13797 -1.722326,0.0783 z m 2.047551,-1.59458 c 0.481849,-0.18679 0.812021,-0.50311 0.937398,-0.89785 0.0262,-0.0825 0.05632,-0.47809 0.0665,-0.87815 l 0.01868,-0.72719 -1.161576,0.009 c -0.788425,0.006 -1.261126,0.0192 -1.471468,0.0575 -0.510498,0.091 -0.799062,0.27668 -1.003256,0.64529 -0.111719,0.2017 -0.120972,0.25013 -0.120062,0.62832 0.0013,0.36365 0.01337,0.43336 0.110676,0.61952 0.272183,0.5206 0.684704,0.67682 1.732311,0.65613 0.559945,-0.0115 0.689938,-0.0279 0.890736,-0.10431 z m -3.5882653,-9.87213 -0.5656376,-0.56673 0.2447756,-0.2266 c 0.6118003,-0.5663 1.4515843,-0.96637 2.3627563,-1.12537 0.545382,-0.0951 1.465068,-0.0576 1.999438,0.0823 0.733766,0.19174 1.472932,0.58373 2.016315,1.06968 l 0.204881,0.18324 -0.573145,0.57523 c -0.315206,0.31631 -0.584161,0.57523 -0.597676,0.57523 -0.01342,0 -0.140724,-0.0931 -0.282724,-0.20705 -1.055902,-0.84748 -2.559743,-0.91322 -3.702971,-0.16201 -0.161386,0.10587 -0.328551,0.2323 -0.371484,0.28102 -0.04292,0.049 -0.0985,0.0879 -0.123475,0.0879 -0.02495,0 -0.299954,-0.25509 -0.6110533,-0.56673 z m -2.1781382,-2.17804 c -0.3100604,-0.31079 -0.5568856,-0.58373 -0.5485074,-0.60669 0.00832,-0.0233 0.1350755,-0.14839 0.2815787,-0.2789 2.7151852,-2.4157 6.7002492,-2.69417 9.6953872,-0.67726 0.508055,0.34224 1.163467,0.88431 1.163467,0.96254 0,0.0239 -0.251987,0.29803 -0.559984,0.60659 l -0.55999,0.56087 -0.2698,-0.24574 c -0.563238,-0.51273 -1.460517,-1.03821 -2.182728,-1.278 -0.715944,-0.23766 -1.095602,-0.29378 -1.979835,-0.29335 -0.626666,0.002 -0.905989,0.0189 -1.186843,0.0747 -1.111256,0.22413 -2.0986858,0.70918 -2.9565039,1.45192 l -0.3324971,0.28784 z"
+       id="path946"
+       inkscape:connector-curvature="0" />
+  </g>
+</svg>
diff --git a/nymea-app/ui/images/browser/MediaBrowserIconAmazon.svg b/nymea-app/ui/images/browser/MediaBrowserIconAmazon.svg
new file mode 100644
index 00000000..e3381f3b
--- /dev/null
+++ b/nymea-app/ui/images/browser/MediaBrowserIconAmazon.svg
@@ -0,0 +1,160 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="96"
+   height="96"
+   id="svg4874"
+   version="1.1"
+   inkscape:version="0.91+devel r"
+   viewBox="0 0 96 96.000001"
+   sodipodi:docname="amazon-symbolic.svg">
+  <defs
+     id="defs4876" />
+  <sodipodi:namedview
+     id="base"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageopacity="0.0"
+     inkscape:pageshadow="2"
+     inkscape:zoom="5.6199993"
+     inkscape:cx="21.788253"
+     inkscape:cy="55.204611"
+     inkscape:document-units="px"
+     inkscape:current-layer="g4780"
+     showgrid="true"
+     showborder="true"
+     fit-margin-top="0"
+     fit-margin-left="0"
+     fit-margin-right="0"
+     fit-margin-bottom="0"
+     inkscape:snap-bbox="true"
+     inkscape:bbox-paths="true"
+     inkscape:bbox-nodes="true"
+     inkscape:snap-bbox-edge-midpoints="true"
+     inkscape:snap-bbox-midpoints="true"
+     inkscape:object-paths="true"
+     inkscape:snap-intersection-paths="true"
+     inkscape:object-nodes="true"
+     inkscape:snap-smooth-nodes="true"
+     inkscape:snap-midpoints="true"
+     inkscape:snap-object-midpoints="true"
+     inkscape:snap-center="true"
+     showguides="true"
+     inkscape:guide-bbox="true"
+     inkscape:snap-global="true">
+    <inkscape:grid
+       type="xygrid"
+       id="grid5451"
+       empspacing="8" />
+    <sodipodi:guide
+       orientation="1,0"
+       position="8,-8.0000001"
+       id="guide4063" />
+    <sodipodi:guide
+       orientation="1,0"
+       position="4,-8.0000001"
+       id="guide4065" />
+    <sodipodi:guide
+       orientation="0,1"
+       position="-8,88.000001"
+       id="guide4067" />
+    <sodipodi:guide
+       orientation="0,1"
+       position="-8,92.000001"
+       id="guide4069" />
+    <sodipodi:guide
+       orientation="0,1"
+       position="104,4"
+       id="guide4071" />
+    <sodipodi:guide
+       orientation="0,1"
+       position="-5,8.0000001"
+       id="guide4073" />
+    <sodipodi:guide
+       orientation="1,0"
+       position="88,-8.0000001"
+       id="guide4077" />
+    <sodipodi:guide
+       orientation="0,1"
+       position="-8,84.000001"
+       id="guide4074" />
+    <sodipodi:guide
+       orientation="1,0"
+       position="12,-8.0000001"
+       id="guide4076" />
+    <sodipodi:guide
+       orientation="1,0"
+       position="84,-8.0000001"
+       id="guide4080" />
+    <sodipodi:guide
+       position="48,-8.0000001"
+       orientation="1,0"
+       id="guide4170" />
+    <sodipodi:guide
+       position="-8,48"
+       orientation="0,1"
+       id="guide4172" />
+    <sodipodi:guide
+       position="92,-8.0000001"
+       orientation="1,0"
+       id="guide4760" />
+  </sodipodi:namedview>
+  <metadata
+     id="metadata4879">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title></dc:title>
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <g
+     inkscape:label="Layer 1"
+     inkscape:groupmode="layer"
+     id="layer1"
+     transform="translate(67.857146,-78.50504)">
+    <g
+       transform="matrix(0,-1,-1,0,373.50506,516.50504)"
+       id="g4845"
+       style="display:inline">
+      <g
+         inkscape:export-ydpi="90"
+         inkscape:export-xdpi="90"
+         inkscape:export-filename="next01.png"
+         transform="matrix(-0.9996045,0,0,1,575.94296,-611.00001)"
+         id="g4778"
+         inkscape:label="Layer 1">
+        <g
+           transform="matrix(-1,0,0,1,575.99999,611)"
+           id="g4780"
+           style="display:inline">
+          <rect
+             style="color:#000000;display:inline;overflow:visible;visibility:visible;fill:none;stroke:none;stroke-width:4;marker:none;enable-background:accumulate"
+             id="rect4782"
+             width="96.037987"
+             height="96"
+             x="-438.00244"
+             y="345.36221"
+             transform="scale(-1,1)" />
+          <path
+             style="fill:#808080;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:1.00019777"
+             d="m 426.99809,393.22427 c 0,9.84856 -3.67327,20.84806 -15.85755,23.16451 -1.29708,0.23309 -1.98188,-0.69914 -2.17134,-1.54413 l -1.07912,-10.05241 c 0.0444,-0.9324 0.96238,-1.61738 1.89512,-1.79222 4.19744,-0.85956 6.22343,-4.38504 6.22343,-8.33319 0,-2.12706 -0.78687,-4.54557 -2.69644,-5.81307 -2.12774,-1.44233 -5.04267,-1.25318 -7.50594,-1.25318 l -1.341,0 c -0.685,6.00237 -1.12208,13.85544 -3.59972,19.47902 -2.79819,6.48313 -8.52628,11.04267 -16.93614,11.04267 -10.77046,0 -16.14835,-6.78883 -16.14835,-15.50101 0,-7.37185 1.73447,-11.3929 7.53529,-17.07476 -2.72547,-1.89394 -4.05209,-2.50602 -6.90886,-5.94427 -0.40784,-0.77213 -0.36384,-1.76236 0.24835,-2.4471 l -0.0299,-0.0291 c 1.83643,-2.06879 5.11611,-5.82767 6.87972,-7.94015 0.69947,-0.845 1.82166,-0.69925 2.7545,-0.0291 2.62339,1.89395 4.75103,3.90448 9.60445,3.90448 l 16.14888,0 c 6.83571,0 13.11699,-0.48093 17.82476,4.55989 3.81842,3.9773 5.1594,10.5623 5.1594,15.60311 z m -30.84042,-5.62369 -2.24418,0 c -4.03722,0 -7.40399,-0.10192 -10.98935,1.93769 -2.91492,1.64629 -4.70776,4.25405 -4.70776,7.16782 0,3.9773 3.03176,6.29393 7.50615,6.29393 8.83228,0 10.43514,-7.91105 10.43514,-15.39944 z m -23.17828,-32.69373 c 0.0392,3.22128 -0.61724,7.1796 -2.69644,10.13228 -0.59741,0.85955 -1.42776,0.71357 -1.31123,-0.24069 0.37179,-3.13229 1.20979,-10.11061 -0.37892,-11.34896 -1.59574,-1.24563 -8.16193,1.38435 -11.09132,2.55714 -0.88914,0.35694 -1.24625,-0.40799 -0.57592,-1.20927 4.36511,-5.22291 13.51059,-6.56344 14.82957,-5.49992 0.61518,0.49852 1.19007,2.76709 1.22426,5.60942 z m -1.75007,82.04379 c 0.0423,0.76204 -0.82395,1.16196 -1.49285,0.42213 -10.4719,-11.58946 -16.76765,-26.90841 -16.76765,-43.92473 0,-12.13578 3.82544,-26.23083 10.99607,-35.95549 1.19523,-1.60985 2.9736,-0.23333 2.27392,1.41293 -4.62718,10.89744 -6.8572,22.74906 -6.8572,33.52266 0,15.97466 4.37925,31.43967 11.65928,43.94695 0.11963,0.20488 0.17851,0.39969 0.18843,0.57555 z"
+             id="path8"
+             inkscape:connector-curvature="0" />
+        </g>
+      </g>
+    </g>
+  </g>
+</svg>
diff --git a/nymea-app/ui/images/browser/MediaBrowserIconAux.svg b/nymea-app/ui/images/browser/MediaBrowserIconAux.svg
new file mode 120000
index 00000000..a3c53ece
--- /dev/null
+++ b/nymea-app/ui/images/browser/MediaBrowserIconAux.svg
@@ -0,0 +1 @@
+../action.svg
\ No newline at end of file
diff --git a/nymea-app/ui/images/browser/MediaBrowserIconDisk.svg b/nymea-app/ui/images/browser/MediaBrowserIconDisk.svg
new file mode 100644
index 00000000..1af432c7
--- /dev/null
+++ b/nymea-app/ui/images/browser/MediaBrowserIconDisk.svg
@@ -0,0 +1,166 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="96"
+   height="96"
+   id="svg4874"
+   version="1.1"
+   inkscape:version="0.91+devel r"
+   viewBox="0 0 96 96.000001"
+   sodipodi:docname="media-optical-symbolic.svg">
+  <defs
+     id="defs4876" />
+  <sodipodi:namedview
+     id="base"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageopacity="0.0"
+     inkscape:pageshadow="2"
+     inkscape:zoom="7.0249991"
+     inkscape:cx="-22.569403"
+     inkscape:cy="71.871878"
+     inkscape:document-units="px"
+     inkscape:current-layer="g4780"
+     showgrid="true"
+     showborder="true"
+     fit-margin-top="0"
+     fit-margin-left="0"
+     fit-margin-right="0"
+     fit-margin-bottom="0"
+     inkscape:snap-bbox="true"
+     inkscape:bbox-paths="true"
+     inkscape:bbox-nodes="true"
+     inkscape:snap-bbox-edge-midpoints="true"
+     inkscape:snap-bbox-midpoints="true"
+     inkscape:object-paths="true"
+     inkscape:snap-intersection-paths="true"
+     inkscape:object-nodes="false"
+     inkscape:snap-smooth-nodes="false"
+     inkscape:snap-midpoints="false"
+     inkscape:snap-object-midpoints="true"
+     inkscape:snap-center="true"
+     showguides="true"
+     inkscape:guide-bbox="true"
+     inkscape:snap-global="true"
+     inkscape:snap-others="false">
+    <inkscape:grid
+       type="xygrid"
+       id="grid5451"
+       empspacing="8" />
+    <sodipodi:guide
+       orientation="1,0"
+       position="8,-8.0000001"
+       id="guide4063" />
+    <sodipodi:guide
+       orientation="1,0"
+       position="4,-8.0000001"
+       id="guide4065" />
+    <sodipodi:guide
+       orientation="0,1"
+       position="-8,88.000001"
+       id="guide4067" />
+    <sodipodi:guide
+       orientation="0,1"
+       position="-8,92.000001"
+       id="guide4069" />
+    <sodipodi:guide
+       orientation="0,1"
+       position="104,4"
+       id="guide4071" />
+    <sodipodi:guide
+       orientation="0,1"
+       position="-5,8.0000001"
+       id="guide4073" />
+    <sodipodi:guide
+       orientation="1,0"
+       position="88,-8.0000001"
+       id="guide4077" />
+    <sodipodi:guide
+       orientation="0,1"
+       position="-8,84.000001"
+       id="guide4074" />
+    <sodipodi:guide
+       orientation="1,0"
+       position="12,-8.0000001"
+       id="guide4076" />
+    <sodipodi:guide
+       orientation="1,0"
+       position="84,-8.0000001"
+       id="guide4080" />
+    <sodipodi:guide
+       position="48,-8.0000001"
+       orientation="1,0"
+       id="guide4170" />
+    <sodipodi:guide
+       position="-8,48"
+       orientation="0,1"
+       id="guide4172" />
+    <sodipodi:guide
+       position="92,-8.0000001"
+       orientation="1,0"
+       id="guide4760" />
+  </sodipodi:namedview>
+  <metadata
+     id="metadata4879">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title />
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <g
+     inkscape:label="Layer 1"
+     inkscape:groupmode="layer"
+     id="layer1"
+     transform="translate(67.857146,-78.50504)">
+    <g
+       transform="matrix(0,-1,-1,0,373.50506,516.50504)"
+       id="g4845"
+       style="display:inline">
+      <g
+         inkscape:export-ydpi="90"
+         inkscape:export-xdpi="90"
+         inkscape:export-filename="next01.png"
+         transform="matrix(-0.9996045,0,0,1,575.94296,-611.00001)"
+         id="g4778"
+         inkscape:label="Layer 1">
+        <g
+           transform="matrix(-1,0,0,1,575.99999,611)"
+           id="g4780"
+           style="display:inline">
+          <rect
+             style="color:#000000;display:inline;overflow:visible;visibility:visible;fill:none;stroke:none;stroke-width:4;marker:none;enable-background:accumulate"
+             id="rect4782"
+             width="96.037987"
+             height="96"
+             x="-438.00244"
+             y="345.36221"
+             transform="scale(-1,1)" />
+          <path
+             style="color:#000000;font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:medium;line-height:normal;font-family:sans-serif;font-variant-ligatures:normal;font-variant-position:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-alternates:normal;font-feature-settings:normal;text-indent:0;text-align:start;text-decoration:none;text-decoration-line:none;text-decoration-style:solid;text-decoration-color:#000000;letter-spacing:normal;word-spacing:normal;text-transform:none;writing-mode:lr-tb;direction:ltr;text-orientation:mixed;baseline-shift:baseline;text-anchor:start;white-space:normal;shape-padding:0;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;opacity:1;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;fill:#808080;fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:4.00079107;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker:none;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate"
+             d="m 432,393.36133 c 0,23.17269 -18.83505,42 -42.01562,42 -23.18058,0 -42.01758,-18.82731 -42.01758,-42 0,-23.17269 18.837,-42 42.01758,-42 23.18057,0 42.01562,18.82731 42.01562,42 z m -4.00195,0 c 0,-21.00965 -16.99443,-37.99805 -38.01367,-37.99805 -21.01925,0 -38.01563,16.9884 -38.01563,37.99805 0,21.00965 16.99638,38 38.01563,38 21.01924,0 38.01367,-16.99035 38.01367,-38 z"
+             id="path4184"
+             inkscape:connector-curvature="0" />
+          <path
+             style="color:#000000;font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:medium;line-height:normal;font-family:sans-serif;font-variant-ligatures:normal;font-variant-position:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-alternates:normal;font-feature-settings:normal;text-indent:0;text-align:start;text-decoration:none;text-decoration-line:none;text-decoration-style:solid;text-decoration-color:#000000;letter-spacing:normal;word-spacing:normal;text-transform:none;writing-mode:lr-tb;direction:ltr;text-orientation:mixed;baseline-shift:baseline;text-anchor:start;white-space:normal;shape-padding:0;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;opacity:1;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;fill:#808080;fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:8.00158215;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker:none;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate"
+             d="m 405.98828,393.36133 c 0,8.78984 -7.21312,16 -16.0039,16 -8.79079,0 -16.00586,-7.21016 -16.00586,-16 0,-8.78984 7.21507,-15.99805 16.00586,-15.99805 8.79078,0 16.0039,7.20821 16.0039,15.99805 z m -8.00195,0 c 0,-4.46368 -3.53376,-7.99805 -8.00195,-7.99805 -4.4682,0 -8.00391,3.53437 -8.00391,7.99805 0,4.46368 3.53571,7.99805 8.00391,7.99805 4.46819,0 8.00195,-3.53437 8.00195,-7.99805 z"
+             id="ellipse4200"
+             inkscape:connector-curvature="0" />
+        </g>
+      </g>
+    </g>
+  </g>
+</svg>
diff --git a/nymea-app/ui/images/browser/MediaBrowserIconLibrary.svg b/nymea-app/ui/images/browser/MediaBrowserIconLibrary.svg
new file mode 120000
index 00000000..1762fbfe
--- /dev/null
+++ b/nymea-app/ui/images/browser/MediaBrowserIconLibrary.svg
@@ -0,0 +1 @@
+../mediaplayer-app-symbolic.svg
\ No newline at end of file
diff --git a/nymea-app/ui/images/browser/MediaBrowserIconMusicLibrary.svg b/nymea-app/ui/images/browser/MediaBrowserIconMusicLibrary.svg
new file mode 120000
index 00000000..cf37aa30
--- /dev/null
+++ b/nymea-app/ui/images/browser/MediaBrowserIconMusicLibrary.svg
@@ -0,0 +1 @@
+BrowserIconMusic.svg
\ No newline at end of file
diff --git a/nymea-app/ui/images/browser/MediaBrowserIconNetwork.svg b/nymea-app/ui/images/browser/MediaBrowserIconNetwork.svg
new file mode 100644
index 00000000..0bf511ee
--- /dev/null
+++ b/nymea-app/ui/images/browser/MediaBrowserIconNetwork.svg
@@ -0,0 +1,216 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="96"
+   height="96"
+   id="svg4874"
+   version="1.1"
+   inkscape:version="0.91+devel r"
+   viewBox="0 0 96 96.000001"
+   sodipodi:docname="server03.svg">
+  <defs
+     id="defs4876" />
+  <sodipodi:namedview
+     id="base"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageopacity="0.0"
+     inkscape:pageshadow="2"
+     inkscape:zoom="5.6199993"
+     inkscape:cx="-10.373672"
+     inkscape:cy="59.564043"
+     inkscape:document-units="px"
+     inkscape:current-layer="g4780"
+     showgrid="true"
+     showborder="true"
+     fit-margin-top="0"
+     fit-margin-left="0"
+     fit-margin-right="0"
+     fit-margin-bottom="0"
+     inkscape:snap-bbox="true"
+     inkscape:bbox-paths="true"
+     inkscape:bbox-nodes="true"
+     inkscape:snap-bbox-edge-midpoints="true"
+     inkscape:snap-bbox-midpoints="true"
+     inkscape:object-paths="true"
+     inkscape:snap-intersection-paths="true"
+     inkscape:object-nodes="true"
+     inkscape:snap-smooth-nodes="true"
+     inkscape:snap-midpoints="true"
+     inkscape:snap-object-midpoints="true"
+     inkscape:snap-center="true"
+     showguides="true"
+     inkscape:guide-bbox="true"
+     inkscape:snap-global="true">
+    <inkscape:grid
+       type="xygrid"
+       id="grid5451"
+       empspacing="8" />
+    <sodipodi:guide
+       orientation="1,0"
+       position="8,-8.0000001"
+       id="guide4063" />
+    <sodipodi:guide
+       orientation="1,0"
+       position="4,-8.0000001"
+       id="guide4065" />
+    <sodipodi:guide
+       orientation="0,1"
+       position="-8,88.000001"
+       id="guide4067" />
+    <sodipodi:guide
+       orientation="0,1"
+       position="-8,92.000001"
+       id="guide4069" />
+    <sodipodi:guide
+       orientation="0,1"
+       position="104,4"
+       id="guide4071" />
+    <sodipodi:guide
+       orientation="0,1"
+       position="-5,8.0000001"
+       id="guide4073" />
+    <sodipodi:guide
+       orientation="1,0"
+       position="88,-8.0000001"
+       id="guide4077" />
+    <sodipodi:guide
+       orientation="0,1"
+       position="-8,84.000001"
+       id="guide4074" />
+    <sodipodi:guide
+       orientation="1,0"
+       position="12,-8.0000001"
+       id="guide4076" />
+    <sodipodi:guide
+       orientation="1,0"
+       position="84,-8.0000001"
+       id="guide4080" />
+    <sodipodi:guide
+       position="48,-8.0000001"
+       orientation="1,0"
+       id="guide4170" />
+    <sodipodi:guide
+       position="-8,48"
+       orientation="0,1"
+       id="guide4172" />
+    <sodipodi:guide
+       position="92,-8.0000001"
+       orientation="1,0"
+       id="guide4760" />
+    <sodipodi:guide
+       position="108,12"
+       orientation="0,1"
+       id="guide4182" />
+  </sodipodi:namedview>
+  <metadata
+     id="metadata4879">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title />
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <g
+     inkscape:label="Layer 1"
+     inkscape:groupmode="layer"
+     id="layer1"
+     transform="translate(67.857146,-78.50504)">
+    <g
+       transform="matrix(0,-1,-1,0,373.50506,516.50504)"
+       id="g4845"
+       style="display:inline">
+      <g
+         inkscape:export-ydpi="90"
+         inkscape:export-xdpi="90"
+         inkscape:export-filename="next01.png"
+         transform="matrix(-0.9996045,0,0,1,575.94296,-611.00001)"
+         id="g4778"
+         inkscape:label="Layer 1">
+        <g
+           transform="matrix(-1,0,0,1,575.99999,611)"
+           id="g4780"
+           style="display:inline">
+          <rect
+             style="color:#000000;display:inline;overflow:visible;visibility:visible;fill:none;stroke:none;stroke-width:4;marker:none;enable-background:accumulate"
+             id="rect4782"
+             width="96.037987"
+             height="96"
+             x="-438.00244"
+             y="345.36221"
+             transform="scale(-1,1)" />
+          <path
+             style="color:#000000;display:inline;overflow:visible;visibility:visible;opacity:1;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#808080;stroke-width:4.00079107;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker:none;enable-background:accumulate"
+             d="m 351.96844,433.36223 v -80"
+             id="path4205"
+             inkscape:connector-curvature="0" />
+          <path
+             style="color:#000000;display:inline;overflow:visible;visibility:visible;opacity:1;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#808080;stroke-width:4.00079155;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker:none;enable-background:accumulate"
+             d="M 364.97358,393.36222 H 350.96804"
+             id="path4207"
+             inkscape:connector-curvature="0" />
+          <path
+             style="color:#000000;font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:medium;line-height:normal;font-family:sans-serif;font-variant-ligatures:normal;font-variant-position:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-alternates:normal;font-feature-settings:normal;text-indent:0;text-align:start;text-decoration:none;text-decoration-line:none;text-decoration-style:solid;text-decoration-color:#000000;letter-spacing:normal;word-spacing:normal;text-transform:none;direction:ltr;block-progression:tb;writing-mode:lr-tb;baseline-shift:baseline;text-anchor:start;white-space:normal;shape-padding:0;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;opacity:1;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;fill:#808080;fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:4.00000048;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker:none;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate"
+             d="M 7.9980469 6 L 7.9980469 8 L 7.9980469 22 L 12 22 L 12 9.9980469 L 83.998047 9.9980469 L 83.998047 22 L 88 22 L 88 6 L 7.9980469 6 z M 7.9980469 28 L 7.9980469 44 L 12 44 L 12 28 L 7.9980469 28 z M 83.998047 28 L 83.998047 44 L 88 44 L 88 28 L 83.998047 28 z M 7.9980469 50 L 7.9980469 76 L 88 76 L 88 50 L 83.998047 50 L 83.998047 72.001953 L 12 72.001953 L 12 50 L 7.9980469 50 z "
+             transform="matrix(0,-1,-1.0003957,0,438.00245,441.36222)"
+             id="rect4236" />
+          <path
+             inkscape:connector-curvature="0"
+             id="path4238"
+             d="m 407.9906,433.36223 v -80"
+             style="color:#000000;display:inline;overflow:visible;visibility:visible;opacity:1;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#808080;stroke-width:4.00079107;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker:none;enable-background:accumulate" />
+          <path
+             style="color:#000000;display:inline;overflow:visible;visibility:visible;opacity:1;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#808080;stroke-width:4.00079107;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker:none;enable-background:accumulate"
+             d="m 385.98192,433.36223 v -80"
+             id="path4240"
+             inkscape:connector-curvature="0" />
+          <rect
+             style="color:#000000;display:inline;overflow:visible;visibility:visible;opacity:1;fill:#808080;fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:4.00079155;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker:none;enable-background:accumulate"
+             id="rect4242"
+             width="12.000004"
+             height="6.0023742"
+             x="-375.36224"
+             y="-421.99612"
+             transform="matrix(0,-1,-1,0,0,0)" />
+          <rect
+             transform="matrix(0,-1,-1,0,0,0)"
+             y="-399.9874"
+             x="-375.36224"
+             height="6.0023742"
+             width="12.000004"
+             id="rect4244"
+             style="color:#000000;display:inline;overflow:visible;visibility:visible;opacity:1;fill:#808080;fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:4.00079155;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker:none;enable-background:accumulate" />
+          <rect
+             style="color:#000000;display:inline;overflow:visible;visibility:visible;opacity:1;fill:#808080;fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:4.00079155;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker:none;enable-background:accumulate"
+             id="rect4246"
+             width="12.000004"
+             height="6.0023742"
+             x="-375.36224"
+             y="-377.97867"
+             transform="matrix(0,-1,-1,0,0,0)" />
+          <ellipse
+             style="color:#000000;display:inline;overflow:visible;visibility:visible;opacity:1;fill:#808080;fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:4.00079155;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:10.79999924;stroke-opacity:1;marker:none;enable-background:accumulate"
+             id="path4208"
+             cx="-393.36221"
+             cy="-351.96841"
+             transform="matrix(0,-1,-1,0,0,0)"
+             rx="6.0000005"
+             ry="6.0023746" />
+        </g>
+      </g>
+    </g>
+  </g>
+</svg>
diff --git a/nymea-app/ui/images/browser/MediaBrowserIconPictureLibrary.svg b/nymea-app/ui/images/browser/MediaBrowserIconPictureLibrary.svg
new file mode 120000
index 00000000..87b2075a
--- /dev/null
+++ b/nymea-app/ui/images/browser/MediaBrowserIconPictureLibrary.svg
@@ -0,0 +1 @@
+BrowserIconPicture.svg
\ No newline at end of file
diff --git a/nymea-app/ui/images/browser/MediaBrowserIconPlaylist.svg b/nymea-app/ui/images/browser/MediaBrowserIconPlaylist.svg
new file mode 100644
index 00000000..3ab686d4
--- /dev/null
+++ b/nymea-app/ui/images/browser/MediaBrowserIconPlaylist.svg
@@ -0,0 +1,193 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="96"
+   height="96"
+   id="svg4874"
+   version="1.1"
+   inkscape:version="0.91+devel r"
+   viewBox="0 0 96 96.000001"
+   sodipodi:docname="media-playlist.svg">
+  <defs
+     id="defs4876" />
+  <sodipodi:namedview
+     id="base"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageopacity="0.0"
+     inkscape:pageshadow="2"
+     inkscape:zoom="7.024999"
+     inkscape:cx="1.5729484"
+     inkscape:cy="43.174365"
+     inkscape:document-units="px"
+     inkscape:current-layer="g4780"
+     showgrid="true"
+     showborder="true"
+     fit-margin-top="0"
+     fit-margin-left="0"
+     fit-margin-right="0"
+     fit-margin-bottom="0"
+     inkscape:snap-bbox="true"
+     inkscape:bbox-paths="true"
+     inkscape:bbox-nodes="true"
+     inkscape:snap-bbox-edge-midpoints="true"
+     inkscape:snap-bbox-midpoints="true"
+     inkscape:object-paths="true"
+     inkscape:snap-intersection-paths="true"
+     inkscape:object-nodes="true"
+     inkscape:snap-smooth-nodes="true"
+     inkscape:snap-midpoints="true"
+     inkscape:snap-object-midpoints="true"
+     inkscape:snap-center="true"
+     showguides="true"
+     inkscape:guide-bbox="true">
+    <inkscape:grid
+       type="xygrid"
+       id="grid5451"
+       empspacing="8" />
+    <sodipodi:guide
+       orientation="1,0"
+       position="8,-8.0000001"
+       id="guide4063" />
+    <sodipodi:guide
+       orientation="1,0"
+       position="4,-8.0000001"
+       id="guide4065" />
+    <sodipodi:guide
+       orientation="0,1"
+       position="-8,88.000001"
+       id="guide4067" />
+    <sodipodi:guide
+       orientation="0,1"
+       position="-8,92.000001"
+       id="guide4069" />
+    <sodipodi:guide
+       orientation="0,1"
+       position="104,4"
+       id="guide4071" />
+    <sodipodi:guide
+       orientation="0,1"
+       position="-5,8.0000001"
+       id="guide4073" />
+    <sodipodi:guide
+       orientation="1,0"
+       position="92,-8.0000001"
+       id="guide4075" />
+    <sodipodi:guide
+       orientation="1,0"
+       position="88,-8.0000001"
+       id="guide4077" />
+    <sodipodi:guide
+       orientation="0,1"
+       position="-8,84.000001"
+       id="guide4074" />
+    <sodipodi:guide
+       orientation="1,0"
+       position="12,-8.0000001"
+       id="guide4076" />
+    <sodipodi:guide
+       orientation="0,1"
+       position="-5,12"
+       id="guide4078" />
+    <sodipodi:guide
+       orientation="1,0"
+       position="84,-9.0000001"
+       id="guide4080" />
+    <sodipodi:guide
+       position="48,-8.0000001"
+       orientation="1,0"
+       id="guide4170" />
+    <sodipodi:guide
+       position="-8,48"
+       orientation="0,1"
+       id="guide4172" />
+  </sodipodi:namedview>
+  <metadata
+     id="metadata4879">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title></dc:title>
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <g
+     inkscape:label="Layer 1"
+     inkscape:groupmode="layer"
+     id="layer1"
+     transform="translate(67.857146,-78.50504)">
+    <g
+       transform="matrix(0,-1,-1,0,373.50506,516.50504)"
+       id="g4845"
+       style="display:inline">
+      <g
+         inkscape:export-ydpi="90"
+         inkscape:export-xdpi="90"
+         inkscape:export-filename="next01.png"
+         transform="matrix(-0.9996045,0,0,1,575.94296,-611.00001)"
+         id="g4778"
+         inkscape:label="Layer 1">
+        <g
+           transform="matrix(-1,0,0,1,575.99999,611)"
+           id="g4780"
+           style="display:inline">
+          <rect
+             style="color:#000000;display:inline;overflow:visible;visibility:visible;fill:none;stroke:none;stroke-width:4;marker:none;enable-background:accumulate"
+             id="rect4782"
+             width="96.037987"
+             height="96"
+             x="-438.00244"
+             y="345.36221"
+             transform="scale(-1,1)" />
+          <path
+             style="color:#000000;display:inline;overflow:visible;visibility:visible;fill:#808080;fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:3;marker:none;enable-background:accumulate"
+             d="M 12 4 L 11.996094 60 C 11.996094 60 38.67204 48.520868 62 31.982422 C 62 31.978423 61.997094 31.973494 61.996094 31.966797 C 61.993094 31.962798 61.990375 31.954817 61.984375 31.949219 C 61.981375 31.94522 61.975256 31.935285 61.972656 31.929688 C 61.969656 31.925689 61.966797 31.91956 61.966797 31.914062 C 37.360487 14.848185 12 4 12 4 z M 16.052734 10.435547 C 22.210524 13.23248 36.461491 20.11424 54.519531 31.978516 C 37.108361 43.569719 22.328791 50.699781 16.050781 53.556641 L 16.052734 10.435547 z "
+             transform="matrix(0,-1,-1.0003957,0,438.00245,441.36222)"
+             id="path4176" />
+          <path
+             style="color:#000000;display:inline;overflow:visible;visibility:visible;fill:#808080;fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:3;marker:none;enable-background:accumulate"
+             d="m 388.43206,361.07316 c -0.12331,-0.0552 -0.008,-0.0131 -0.0996,-0.0586 a 4.0244714,4.0244712 0 0 1 -0.21883,-0.10547 c -0.002,-0.001 0.01,0.007 0.008,0.006 l 0.31067,0.15821 z"
+             id="path2194-5" />
+          <rect
+             style="color:#000000;display:inline;overflow:visible;visibility:visible;opacity:1;fill:#808080;fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:4.00079155;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker:none;enable-background:accumulate"
+             id="rect4178"
+             width="8"
+             height="8.0031652"
+             x="-429.36221"
+             y="-353.96921"
+             transform="matrix(0,-1,-1,0,0,0)" />
+          <path
+             style="color:#000000;font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:medium;line-height:normal;font-family:sans-serif;font-variant-ligatures:none;font-variant-position:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-alternates:normal;font-feature-settings:normal;text-indent:0;text-align:start;text-decoration:none;text-decoration-line:none;text-decoration-style:solid;text-decoration-color:#000000;letter-spacing:normal;word-spacing:normal;text-transform:none;direction:ltr;block-progression:tb;writing-mode:lr-tb;baseline-shift:baseline;text-anchor:start;white-space:normal;shape-padding:0;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;opacity:1;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;fill:#808080;fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:4;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker:none;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate"
+             d="m 347.9668,357.36133 0,56 4,0 0,-56 -4,0 z"
+             id="path4180"
+             inkscape:connector-curvature="0" />
+          <rect
+             transform="matrix(0,-1,-1,0,0,0)"
+             y="-369.97556"
+             x="-429.36221"
+             height="8.0031652"
+             width="8"
+             id="rect4182"
+             style="color:#000000;display:inline;overflow:visible;visibility:visible;opacity:1;fill:#808080;fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:4.00079155;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker:none;enable-background:accumulate" />
+          <path
+             style="color:#000000;font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:medium;line-height:normal;font-family:sans-serif;font-variant-ligatures:none;font-variant-position:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-alternates:normal;font-feature-settings:normal;text-indent:0;text-align:start;text-decoration:none;text-decoration-line:none;text-decoration-style:solid;text-decoration-color:#000000;letter-spacing:normal;word-spacing:normal;text-transform:none;direction:ltr;block-progression:tb;writing-mode:lr-tb;baseline-shift:baseline;text-anchor:start;white-space:normal;shape-padding:0;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;opacity:1;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;fill:#808080;fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:4;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker:none;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate"
+             d="m 363.97461,357.36133 0,56 4,0 0,-56 -4,0 z"
+             id="path4184"
+             inkscape:connector-curvature="0" />
+        </g>
+      </g>
+    </g>
+  </g>
+</svg>
diff --git a/nymea-app/ui/images/browser/MediaBrowserIconRecentlyPlayed.svg b/nymea-app/ui/images/browser/MediaBrowserIconRecentlyPlayed.svg
new file mode 120000
index 00000000..ccbc6e10
--- /dev/null
+++ b/nymea-app/ui/images/browser/MediaBrowserIconRecentlyPlayed.svg
@@ -0,0 +1 @@
+MediaBrowserIconPlaylist.svg
\ No newline at end of file
diff --git a/nymea-app/ui/images/browser/MediaBrowserIconSiriusXM.svg b/nymea-app/ui/images/browser/MediaBrowserIconSiriusXM.svg
new file mode 100644
index 00000000..d6121943
--- /dev/null
+++ b/nymea-app/ui/images/browser/MediaBrowserIconSiriusXM.svg
@@ -0,0 +1,67 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="96"
+   height="96"
+   viewBox="0 0 25.399999 25.400001"
+   version="1.1"
+   id="svg8"
+   inkscape:version="0.92.3 (2405546, 2018-03-11)"
+   sodipodi:docname="MediaBrowserIconSiriusXM.svg">
+  <defs
+     id="defs2" />
+  <sodipodi:namedview
+     id="base"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageopacity="0.0"
+     inkscape:pageshadow="2"
+     inkscape:zoom="2.8"
+     inkscape:cx="14.836233"
+     inkscape:cy="62.45569"
+     inkscape:document-units="mm"
+     inkscape:current-layer="layer1"
+     showgrid="true"
+     units="px"
+     inkscape:window-width="2792"
+     inkscape:window-height="1698"
+     inkscape:window-x="88"
+     inkscape:window-y="44"
+     inkscape:window-maximized="1">
+    <inkscape:grid
+       type="xygrid"
+       id="grid815" />
+  </sodipodi:namedview>
+  <metadata
+     id="metadata5">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title></dc:title>
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <g
+     inkscape:label="Layer 1"
+     inkscape:groupmode="layer"
+     id="layer1"
+     transform="translate(0,-271.59998)">
+    <path
+       style="fill:#808080;stroke-width:1;fill-opacity:1"
+       d="m 10.935318,293.4556 c -1.2341568,-0.23368 -2.4703422,-0.72173 -3.5171533,-1.38861 -0.3367136,-0.2145 -0.3987177,-0.30197 -0.3987177,-0.56242 0,-0.68731 0.3251655,-0.69002 1.620602,-0.0135 1.380573,0.72098 2.474727,0.99708 3.961447,0.99963 1.677112,0.003 3.039782,-0.35451 4.378844,-1.14844 0.736909,-0.4369 1.041062,-0.46895 1.261259,-0.13289 0.233232,0.35595 0.06049,0.62234 -0.686001,1.05786 -0.806256,0.47038 -1.650346,0.81451 -2.608702,1.06355 -0.99085,0.25749 -2.983412,0.31948 -4.011578,0.12481 z m 0.04462,-2.29348 c -0.70928,-0.19127 -1.7457688,-0.6897 -2.2131682,-1.06427 -0.4561875,-0.36559 -0.3153145,-1.00317 0.2216483,-1.00317 0.1415198,0 0.3658898,0.0854 0.4986003,0.1898 0.413054,0.32491 1.4128136,0.74584 2.1382356,0.90026 1.31076,0.27901 2.693077,0.0274 3.949185,-0.71883 0.556697,-0.33073 0.70879,-0.3829 0.910014,-0.31213 0.312379,0.10986 0.469552,0.52354 0.284539,0.74891 -0.253709,0.30906 -1.221039,0.86671 -1.942343,1.11972 -1.000854,0.35107 -2.818211,0.41708 -3.846711,0.13971 z m 0.897344,-2.16411 c -0.485242,-0.0817 -1.332599,-0.44198 -1.76662,-0.75103 -0.208705,-0.14861 -0.2767351,-0.27159 -0.2767351,-0.50025 0,-0.62719 0.3721191,-0.68125 1.2745741,-0.1852 1.050337,0.57733 2.316059,0.5364 3.261944,-0.10549 0.522479,-0.35457 0.684395,-0.37281 0.950153,-0.10705 0.129856,0.12986 0.236102,0.30336 0.236102,0.38558 0,0.38361 -1.055558,1.01386 -2.051655,1.22499 -0.680935,0.14433 -0.960167,0.15093 -1.627763,0.0385 z m -9.6479288,-3.27585 c -0.4275265,-0.12973 -0.6464283,-0.28633 -0.7909853,-0.56587 -0.223761,-0.43271 -0.187573,-0.47096 0.445541,-0.47096 0.4856336,0 0.607511,0.0325 0.7044152,0.18763 0.1374807,0.22014 0.6315723,0.25757 0.7097782,0.0538 0.072429,-0.18877 -0.1079977,-0.30956 -0.6406439,-0.42893 -0.9142549,-0.20489 -1.2669696,-0.50298 -1.2669696,-1.07075 0,-0.29595 0.3408919,-0.70707 0.7163582,-0.86396 0.3977376,-0.16617 1.2654724,-0.16617 1.66321,0 0.3262158,0.13631 0.7163582,0.55815 0.7163582,0.77455 0,0.19176 -1.0625043,0.17665 -1.2235435,-0.0174 -0.1347343,-0.16234 -0.5717842,-0.14888 -0.626945,0.0193 -0.035078,0.10695 0.1565748,0.1833 1.0287653,0.40981 0.6051264,0.15716 0.91554,0.48127 0.91554,0.95595 0,0.6661 -0.6909332,1.11502 -1.688688,1.09719 -0.2321944,-0.004 -0.5301801,-0.0403 -0.6621908,-0.0804 z m 7.7318814,7.1e-4 c -0.4171773,-0.17829 -0.5025722,-0.44581 -0.5025722,-1.5744 v -1.05801 h 0.5125909 0.5125907 l 0.02685,0.9147 0.02685,0.91471 h 0.277219 c 0.339229,0 0.403732,-0.17851 0.41705,-1.15415 l 0.0094,-0.68507 0.492533,0.0284 0.492534,0.0283 0.0261,1.28997 0.0261,1.28997 H 11.7598 c -0.420051,0 -0.518635,-0.0295 -0.518635,-0.15527 0,-0.14171 -0.01574,-0.14102 -0.18035,0.008 -0.211962,0.19183 -0.812993,0.27541 -1.0995806,0.15291 z m 2.9125004,-0.0905 c -0.368346,-0.16729 -0.506778,-0.3384 -0.506778,-0.62639 0,-0.0971 0.126687,-0.13305 0.46908,-0.13305 0.257993,0 0.469079,0.0407 0.469079,0.0905 0,0.13812 0.342866,0.29128 0.509192,0.22746 0.08113,-0.0312 0.14752,-0.11257 0.14752,-0.18097 0,-0.12829 -0.0384,-0.14509 -0.750528,-0.32823 -0.686197,-0.17648 -0.919829,-0.5024 -0.736699,-1.02773 0.137086,-0.39324 0.512077,-0.56356 1.240829,-0.56356 0.516437,0 0.650439,0.0364 0.895911,0.24289 0.158755,0.13358 0.288646,0.32355 0.288646,0.42217 0,0.15208 -0.06966,0.17929 -0.459041,0.17929 -0.321494,0 -0.475225,-0.0421 -0.513045,-0.14072 -0.0546,-0.14227 -0.351897,-0.19271 -0.465611,-0.079 -0.09052,0.0905 0.122385,0.31345 0.299939,0.31405 0.311885,9.5e-4 0.874222,0.20502 1.050035,0.38084 0.110351,0.11035 0.181539,0.3103 0.181539,0.50989 0,0.40031 -0.232317,0.65513 -0.720982,0.79082 -0.520753,0.14461 -0.962731,0.11988 -1.399086,-0.0783 z m -8.0850649,-1.20507 0.0261,-1.28997 0.4925346,-0.0284 0.4925337,-0.0283 v 1.31832 1.31834 H 5.2811979 4.762563 Z m 1.2926172,-0.0235 v -1.31342 h 0.4690804 c 0.4442104,0 0.4690795,0.0131 0.4690795,0.24718 v 0.2472 l 0.194441,-0.2472 c 0.1309462,-0.16647 0.2841249,-0.24718 0.4690804,-0.24718 0.2703513,0 0.2746385,0.008 0.2746385,0.51598 0,0.50856 -0.00398,0.51599 -0.2761282,0.51599 -0.4023695,0 -0.5682158,0.29361 -0.5682158,1.00595 v 0.58892 H 6.5972702 6.0812823 Z m 2.0639516,0 v -1.31342 h 0.5159879 0.5159879 v 1.31342 1.31342 H 8.6612218 8.1452339 Z m 6.7547481,1.25734 c 0,-0.0309 0.232195,-0.38556 0.515988,-0.78826 0.283794,-0.40271 0.515988,-0.77102 0.515988,-0.81847 0,-0.0475 -0.211086,-0.3927 -0.469079,-0.7672 -0.257995,-0.37451 -0.469081,-0.69866 -0.469081,-0.72033 0,-0.0217 0.308312,-0.0394 0.685138,-0.0394 h 0.685136 l 0.192687,0.39784 0.192688,0.39785 0.202966,-0.39785 0.202967,-0.39784 h 0.7132 c 0.557388,0 0.692976,0.0257 0.620628,0.11727 -0.385752,0.48867 -0.962378,1.32651 -0.962378,1.39834 0,0.0483 0.20362,0.3919 0.452489,0.76366 0.248868,0.37176 0.483554,0.7287 0.521524,0.7932 0.05272,0.0896 -0.09816,0.11727 -0.638323,0.11727 h -0.707358 l -0.226315,-0.44532 -0.226314,-0.4453 -0.216349,0.4453 -0.21635,0.44532 h -0.684922 c -0.376708,0 -0.684925,-0.0253 -0.684925,-0.0561 z m 3.752639,-1.53879 v -1.59487 h 0.562896 c 0.508336,0 0.562896,0.019 0.562896,0.19597 0,0.18859 0.01087,0.18682 0.288647,-0.0469 0.189274,-0.15926 0.400814,-0.24288 0.614462,-0.24288 0.372633,0 0.831373,0.20862 0.910149,0.4139 0.04228,0.11017 0.115587,0.0813 0.349646,-0.13725 0.341378,-0.31889 0.853094,-0.37131 1.311358,-0.13434 0.469632,0.24285 0.559825,0.5517 0.559825,1.91698 v 1.22427 h -0.609804 -0.609803 l -0.0012,-0.91471 c -0.0016,-1.14835 -0.04881,-1.33687 -0.334711,-1.33687 -0.330142,0 -0.414532,0.26612 -0.414532,1.30725 v 0.94433 h -0.609802 -0.609805 l -0.0012,-0.91471 c -0.0016,-1.14835 -0.04881,-1.33687 -0.334712,-1.33687 -0.33014,0 -0.41453,0.26612 -0.41453,1.30725 v 0.94433 H 19.262534 18.65273 Z M 4.7678588,282.66818 c 0,-0.22175 0.028146,-0.23453 0.5159879,-0.23453 0.4878431,0 0.5159879,0.0128 0.5159879,0.23453 0,0.22175 -0.028146,0.23454 -0.5159879,0.23454 -0.487844,0 -0.5159879,-0.0128 -0.5159879,-0.23454 z m 3.3773751,0 c 0,-0.22175 0.028146,-0.23453 0.5159879,-0.23453 0.487843,0 0.5159879,0.0128 0.5159879,0.23453 0,0.22175 -0.028146,0.23454 -0.5159879,0.23454 -0.487843,0 -0.5159879,-0.0128 -0.5159879,-0.23454 z m 15.3304421,-0.17587 c -0.02987,-0.0778 -0.03961,-0.21787 -0.02164,-0.31118 0.04128,-0.21435 0.558529,-0.23865 0.615778,-0.029 0.03089,0.11315 0.02103,0.11594 -0.05034,0.0142 -0.128558,-0.18325 -0.441527,-0.0936 -0.441527,0.12651 0,0.22008 0.312969,0.30975 0.441527,0.12649 0.0714,-0.10175 0.08135,-0.099 0.05091,0.0142 -0.05205,0.1936 -0.52504,0.24026 -0.594724,0.0587 z m 0.149192,-0.19939 c 0,-0.0602 0.06333,-0.10945 0.140724,-0.10945 0.0774,0 0.140724,0.0492 0.140724,0.10945 0,0.0602 -0.06333,0.10944 -0.140724,0.10944 -0.0774,0 -0.140724,-0.0492 -0.140724,-0.10944 z m -9.193965,-1.08076 c -1.068455,-0.71502 -2.494651,-0.7335 -3.50851,-0.0455 -0.584048,0.39635 -1.0884711,0.28087 -1.0884711,-0.2492 0,-0.77309 1.9415741,-1.50159 3.4374221,-1.28975 0.755387,0.10697 1.714835,0.54742 2.043613,0.93816 0.291697,0.34666 0.293292,0.36967 0.0473,0.68241 -0.24945,0.31712 -0.412958,0.31078 -0.931351,-0.0362 z m -5.8168292,-1.82783 c -0.2055989,-0.24773 -0.1385357,-0.6284 0.152691,-0.86671 0.4593686,-0.3759 1.7352842,-0.93909 2.5078362,-1.10697 1.053099,-0.22884 2.485705,-0.15574 3.460486,0.17657 0.889303,0.30318 1.845588,0.86805 2.032111,1.20038 0.124375,0.22158 0.122099,0.27233 -0.02209,0.4924 -0.219456,0.33493 -0.514965,0.31373 -1.132378,-0.0813 -0.863375,-0.5523 -1.8272,-0.82794 -2.917419,-0.83434 -1.129746,-0.007 -1.937414,0.21257 -2.8797007,0.78159 -0.6644277,0.40124 -1.0095065,0.46968 -1.2015325,0.2383 z m -1.4820521,-1.84789 c -0.1790697,-0.17906 -0.1315523,-0.61295 0.089703,-0.81908 0.1112546,-0.10366 0.5355242,-0.36183 0.9428212,-0.57374 2.7730091,-1.44267 6.0212471,-1.4858 8.7448991,-0.11611 1.326952,0.66731 1.605682,0.96567 1.315643,1.40833 -0.20037,0.3058 -0.579254,0.27116 -1.213882,-0.11099 -0.79225,-0.47707 -1.772654,-0.8597 -2.665711,-1.04035 -1.064803,-0.21541 -3.048245,-0.14844 -3.992213,0.13477 -0.7133842,0.21404 -1.8810291,0.74246 -2.3003297,1.04103 -0.2956323,0.21051 -0.7490744,0.248 -0.9209305,0.0761 z"
+       id="path830"
+       inkscape:connector-curvature="0" />
+  </g>
+</svg>
diff --git a/nymea-app/ui/images/browser/MediaBrowserIconSpotify.svg b/nymea-app/ui/images/browser/MediaBrowserIconSpotify.svg
new file mode 100644
index 00000000..ef1fdece
--- /dev/null
+++ b/nymea-app/ui/images/browser/MediaBrowserIconSpotify.svg
@@ -0,0 +1,17 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+<svg id="svg4479" width="90" height="90" version="1.1" viewBox="0 0 90 90" xmlns="http://www.w3.org/2000/svg" xmlns:cc="http://creativecommons.org/ns#" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#">
+ <metadata id="metadata4484">
+  <rdf:RDF>
+   <cc:Work rdf:about="">
+    <dc:format>image/svg+xml</dc:format>
+    <dc:type rdf:resource="http://purl.org/dc/dcmitype/StillImage"/>
+    <dc:title/>
+   </cc:Work>
+  </rdf:RDF>
+ </metadata>
+ <g id="layer1" transform="translate(833.57 -695.93)">
+  <rect id="rect4821" x="-833.57" y="695.93" width="90" height="90" style="fill:none"/>
+  <path id="circle4113-5" d="m-788.57 699.93c-22.645 0-41.003 18.358-41.003 41.003s18.358 41.003 41.003 41.003c22.645 0 40.997-18.358 40.997-41.003s-18.352-41.003-40.997-41.003zm-6.3914 19.413c12.597 0 24.974 3.3577 35.787 9.7094 1.6046 0.9425 2.1418 3.0115 1.1992 4.616-0.6281 1.0689-1.7547 1.6591-2.9105 1.6591-0.5793 0-1.1693-0.1444-1.7056-0.46-9.7796-5.7441-20.972-8.7838-32.37-8.7838-6.1581 0-12.258 0.8787-18.127 2.6079-1.787 0.526-3.6587-0.4971-4.1852-2.2819-0.5255-1.785 0.4968-3.6593 2.2818-4.1853 6.4877-1.9115 13.227-2.8814 20.03-2.8814zm0 13.964c10.689 0 21.111 2.9824 30.141 8.6268 1.4207 0.8876 1.854 2.7594 0.9662 4.1795-0.5753 0.9201-1.5676 1.4261-2.5787 1.4261-0.5492 0-1.1009-0.1475-1.6006-0.4598-8.0651-5.0409-17.377-7.707-26.928-7.707-5.3065 0-10.543 0.8178-15.56 2.4274-1.5948 0.5106-3.3009-0.367-3.8127-1.9618-0.5116-1.5946 0.3671-3.3008 1.9617-3.8127 5.6165-1.8014 11.474-2.7185 17.41-2.7185zm0 13.819c8.8197 0 17.31 2.653 24.547 7.672 1.2238 0.8485 1.523 2.5254 0.6751 3.7488-0.5234 0.7548-1.3635 1.1582-2.2178 1.1582-0.5297 0-1.0621-0.1537-1.5308-0.4771-6.3316-4.3911-13.757-6.7116-21.474-6.7116-4.4635 0-8.8307 0.7731-12.981 2.2934-1.3979 0.5123-2.9451-0.2093-3.4575-1.6065-0.5122-1.3982 0.2026-2.9456 1.6007-3.4577 4.7463-1.739 9.7392-2.6195 14.838-2.6195z" style="fill:#808080"/>
+ </g>
+</svg>
diff --git a/nymea-app/ui/images/browser/MediaBrowserIconTidal.svg b/nymea-app/ui/images/browser/MediaBrowserIconTidal.svg
new file mode 100644
index 00000000..b212a6dd
--- /dev/null
+++ b/nymea-app/ui/images/browser/MediaBrowserIconTidal.svg
@@ -0,0 +1,99 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="96"
+   height="96"
+   viewBox="0 0 25.399999 25.400001"
+   version="1.1"
+   id="svg8"
+   inkscape:version="0.92.3 (2405546, 2018-03-11)"
+   sodipodi:docname="MediaBrowserIconTidal.svg">
+  <defs
+     id="defs2" />
+  <sodipodi:namedview
+     id="base"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageopacity="0.0"
+     inkscape:pageshadow="2"
+     inkscape:zoom="5.6"
+     inkscape:cx="7.55591"
+     inkscape:cy="67.715205"
+     inkscape:document-units="mm"
+     inkscape:current-layer="layer1"
+     showgrid="true"
+     units="px"
+     inkscape:window-width="2792"
+     inkscape:window-height="1698"
+     inkscape:window-x="88"
+     inkscape:window-y="44"
+     inkscape:window-maximized="1">
+    <inkscape:grid
+       type="xygrid"
+       id="grid815" />
+  </sodipodi:namedview>
+  <metadata
+     id="metadata5">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title></dc:title>
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <g
+     inkscape:label="Layer 1"
+     inkscape:groupmode="layer"
+     id="layer1"
+     transform="translate(0,-271.59998)">
+    <g
+       id="g914"
+       transform="matrix(0.94444584,0,0,0.94444584,0.20578737,16.293807)"
+       style="stroke-width:1.05882192">
+      <rect
+         transform="rotate(-45)"
+         y="198.78537"
+         x="-196.91451"
+         height="5.6126623"
+         width="5.6126623"
+         id="rect902"
+         style="opacity:0.97000002;fill:#808080;fill-opacity:1;stroke:none;stroke-width:1.05882192;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
+      <rect
+         style="opacity:0.97000002;fill:#808080;fill-opacity:1;stroke:none;stroke-width:1.05882192;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+         id="rect904"
+         width="5.6126623"
+         height="5.6126623"
+         x="-191.30183"
+         y="204.39804"
+         transform="rotate(-45)" />
+      <rect
+         transform="rotate(-45)"
+         y="210.01068"
+         x="-185.68919"
+         height="5.6126623"
+         width="5.6126623"
+         id="rect906"
+         style="opacity:0.97000002;fill:#808080;fill-opacity:1;stroke:none;stroke-width:1.05882192;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
+      <rect
+         transform="rotate(-45)"
+         y="210.01071"
+         x="-196.91451"
+         height="5.6126623"
+         width="5.6126623"
+         id="rect908"
+         style="opacity:0.97000002;fill:#808080;fill-opacity:1;stroke:none;stroke-width:1.05882192;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
+    </g>
+  </g>
+</svg>
diff --git a/nymea-app/ui/images/browser/MediaBrowserIconTuneIn.svg b/nymea-app/ui/images/browser/MediaBrowserIconTuneIn.svg
new file mode 100644
index 00000000..79c73f9b
--- /dev/null
+++ b/nymea-app/ui/images/browser/MediaBrowserIconTuneIn.svg
@@ -0,0 +1,86 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Generator: Adobe Illustrator 22.0.1, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   version="1.1"
+   x="0px"
+   y="0px"
+   viewBox="56 56 96 96"
+   xml:space="preserve"
+   id="svg12"
+   sodipodi:docname="MediaBrowserIconTuneIn.svg"
+   width="96"
+   height="96"
+   inkscape:version="0.92.3 (2405546, 2018-03-11)"><metadata
+   id="metadata18"><rdf:RDF><cc:Work
+       rdf:about=""><dc:format>image/svg+xml</dc:format><dc:type
+         rdf:resource="http://purl.org/dc/dcmitype/StillImage" /><dc:title></dc:title></cc:Work></rdf:RDF></metadata><defs
+   id="defs16">
+	
+</defs><sodipodi:namedview
+   pagecolor="#ffffff"
+   bordercolor="#666666"
+   borderopacity="1"
+   objecttolerance="10"
+   gridtolerance="10"
+   guidetolerance="10"
+   inkscape:pageopacity="0"
+   inkscape:pageshadow="2"
+   inkscape:window-width="2792"
+   inkscape:window-height="1698"
+   id="namedview14"
+   showgrid="true"
+   inkscape:zoom="7.5853273"
+   inkscape:cx="58.524091"
+   inkscape:cy="41.923043"
+   inkscape:window-x="88"
+   inkscape:window-y="44"
+   inkscape:window-maximized="1"
+   inkscape:current-layer="svg12"><inkscape:grid
+     type="xygrid"
+     id="grid828" /></sodipodi:namedview>
+<style
+   type="text/css"
+   id="style2">
+	.st0{display:none;}
+	.st1{fill:#1C203C;}
+</style>
+<g
+   id="Other_Stuff"
+   class="st0"
+   style="display:none"
+   transform="translate(0,8)">
+</g>
+<g
+   id="Clear_Space"
+   transform="translate(0,8)">
+</g>
+<g
+   style="stroke-width:2.24266672;fill:#808080;fill-opacity:1"
+   id="Logo__x2013__Horizontal_1A_12_"
+   transform="matrix(0.44589774,0,0,0.44589774,34.439953,59.410226)">
+		<g
+   style="stroke-width:2.24266672;fill:#808080;fill-opacity:1"
+   id="Logo_2_">
+			<path
+   style="fill:#808080;stroke-width:2.24266672;fill-opacity:1"
+   inkscape:connector-curvature="0"
+   id="path6"
+   d="m 95,96.8 v 4 c 0,0.4 -0.4,0.8 -0.8,0.8 h -5 c -0.2,0 -0.4,0.2 -0.4,0.4 v 21.2 c 0,0.4 -0.4,0.8 -0.8,0.8 h -4 c -0.4,0 -0.8,-0.4 -0.8,-0.8 V 102 c 0,-0.2 -0.2,-0.4 -0.4,-0.4 h -5 c -0.4,0 -0.8,-0.4 -0.8,-0.8 v -4 C 77,96.4 77.4,96 77.8,96 h 16.4 c 0.4,0 0.8,0.4 0.8,0.8 z M 117,96 h -4 c -0.4,0 -0.8,0.4 -0.8,0.8 v 18.8 c 0,1.8 -1.4,3.2 -3.9,3.2 -2.4,0 -3.8,-1.4 -3.8,-3.2 V 96.8 c 0,-0.4 -0.4,-0.8 -0.8,-0.8 h -4 c -0.4,0 -0.8,0.4 -0.8,0.8 v 18.8 c 0,4.8 4,8.8 9.4,8.8 5.5,0 9.5,-4 9.5,-8.8 V 96.8 c 0,-0.4 -0.4,-0.8 -0.8,-0.8 z m 22.6,0 h -4 c -0.4,0 -0.8,0.4 -0.8,0.8 v 15 c 0,0.2 -0.3,0.3 -0.4,0.1 l -5.5,-15.2 c -0.1,-0.4 -0.4,-0.7 -1,-0.7 h -4.8 c -0.4,0 -0.8,0.4 -0.8,0.8 v 26.4 c 0,0.4 0.4,0.8 0.8,0.8 h 4 c 0.4,0 0.8,-0.4 0.8,-0.8 v -13.8 c 0,-0.2 0.3,-0.3 0.4,-0.1 l 5.4,14 c 0.1,0.3 0.4,0.7 1.1,0.7 h 4.7 c 0.4,0 0.8,-0.4 0.8,-0.8 V 96.8 C 140.4,96.4 140,96 139.6,96 Z m 20.7,22.4 h -9.5 c -0.2,0 -0.4,-0.2 -0.4,-0.4 v -4.8 c 0,-0.2 0.2,-0.4 0.4,-0.4 h 9 c 0.4,0 0.8,-0.4 0.8,-0.8 v -4 c 0,-0.4 -0.4,-0.8 -0.8,-0.8 h -9 c -0.2,0 -0.4,-0.2 -0.4,-0.4 V 102 c 0,-0.2 0.2,-0.4 0.4,-0.4 h 9.3 c 0.4,0 0.8,-0.4 0.8,-0.8 v -4 c 0,-0.4 -0.4,-0.8 -0.8,-0.8 h -14.5 c -0.4,0 -0.8,0.4 -0.8,0.8 v 26.4 c 0,0.4 0.4,0.8 0.8,0.8 h 14.7 c 0.4,0 0.8,-0.4 0.8,-0.8 v -4 c 0,-0.4 -0.4,-0.8 -0.8,-0.8 z M 256,59 v 62 c 0,1.7 -1.3,3 -3,3 h -69 v 17 c 0,1.7 -1.3,3 -3,3 H 59 c -1.7,0 -3,-1.3 -3,-3 V 79 c 0,-1.7 1.3,-3 3,-3 H 178 V 59 c 0,-1.7 1.3,-3 3,-3 h 72 c 1.7,0 3,1.3 3,3 z M 178,82 H 62.5 C 62.2,82 62,82.2 62,82.5 v 55 c 0,0.3 0.2,0.5 0.5,0.5 h 115 c 0.3,0 0.5,-0.2 0.5,-0.5 z m 35.8,17.4 c 0,-0.4 -0.4,-0.8 -0.8,-0.8 h -3.4 c -0.2,0 -0.4,-0.2 -0.4,-0.4 V 81.8 c 0,-0.2 0.2,-0.4 0.4,-0.4 h 3 c 0.4,0 0.8,-0.4 0.8,-0.8 v -3.8 c 0,-0.4 -0.4,-0.8 -0.8,-0.8 h -12.4 c -0.4,0 -0.8,0.4 -0.8,0.8 v 3.8 c 0,0.4 0.4,0.8 0.8,0.8 h 3 c 0.2,0 0.4,0.2 0.4,0.4 v 16.4 c 0,0.2 -0.2,0.4 -0.4,0.4 h -3.4 c -0.4,0 -0.8,0.4 -0.8,0.8 v 3.8 c 0,0.4 0.4,0.8 0.8,0.8 H 213 c 0.4,0 0.8,-0.4 0.8,-0.8 z m 22.4,-22.6 c 0,-0.4 -0.4,-0.8 -0.8,-0.8 h -4 c -0.4,0 -0.8,0.4 -0.8,0.8 v 15 c 0,0.2 -0.3,0.3 -0.4,0.1 l -5.5,-15.2 c -0.1,-0.4 -0.4,-0.7 -1,-0.7 H 219 c -0.4,0 -0.8,0.4 -0.8,0.8 v 26.4 c 0,0.4 0.4,0.8 0.8,0.8 h 4 c 0.4,0 0.8,-0.4 0.8,-0.8 V 89.4 c 0,-0.2 0.3,-0.3 0.4,-0.1 l 5.4,14 c 0.1,0.3 0.4,0.7 1.1,0.7 h 4.7 c 0.4,0 0.8,-0.4 0.8,-0.8 z"
+   class="st1" />
+		</g>
+	</g>
+<g
+   id="Anatomy"
+   class="st0"
+   style="display:none"
+   transform="translate(0,8)">
+</g>
+</svg>
\ No newline at end of file
diff --git a/nymea-app/ui/images/browser/MediaBrowserIconUSB.svg b/nymea-app/ui/images/browser/MediaBrowserIconUSB.svg
new file mode 100644
index 00000000..9d988a71
--- /dev/null
+++ b/nymea-app/ui/images/browser/MediaBrowserIconUSB.svg
@@ -0,0 +1,203 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="96"
+   height="96"
+   id="svg4874"
+   version="1.1"
+   inkscape:version="0.91+devel r"
+   viewBox="0 0 96 96.000001"
+   sodipodi:docname="stock_usb.svg">
+  <defs
+     id="defs4876" />
+  <sodipodi:namedview
+     id="base"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageopacity="0.0"
+     inkscape:pageshadow="2"
+     inkscape:zoom="7.0249991"
+     inkscape:cx="35.629893"
+     inkscape:cy="53.907462"
+     inkscape:document-units="px"
+     inkscape:current-layer="g4780"
+     showgrid="true"
+     showborder="true"
+     fit-margin-top="0"
+     fit-margin-left="0"
+     fit-margin-right="0"
+     fit-margin-bottom="0"
+     inkscape:snap-bbox="true"
+     inkscape:bbox-paths="true"
+     inkscape:bbox-nodes="true"
+     inkscape:snap-bbox-edge-midpoints="true"
+     inkscape:snap-bbox-midpoints="true"
+     inkscape:object-paths="true"
+     inkscape:snap-intersection-paths="true"
+     inkscape:object-nodes="true"
+     inkscape:snap-smooth-nodes="true"
+     inkscape:snap-midpoints="true"
+     inkscape:snap-object-midpoints="true"
+     inkscape:snap-center="true"
+     showguides="true"
+     inkscape:guide-bbox="true"
+     inkscape:snap-global="true">
+    <inkscape:grid
+       type="xygrid"
+       id="grid5451"
+       empspacing="8" />
+    <sodipodi:guide
+       orientation="1,0"
+       position="8,-8.0000001"
+       id="guide4063" />
+    <sodipodi:guide
+       orientation="1,0"
+       position="4,-8.0000001"
+       id="guide4065" />
+    <sodipodi:guide
+       orientation="0,1"
+       position="-8,88.000001"
+       id="guide4067" />
+    <sodipodi:guide
+       orientation="0,1"
+       position="-8,92.000001"
+       id="guide4069" />
+    <sodipodi:guide
+       orientation="0,1"
+       position="104,4"
+       id="guide4071" />
+    <sodipodi:guide
+       orientation="0,1"
+       position="-5,8.0000001"
+       id="guide4073" />
+    <sodipodi:guide
+       orientation="1,0"
+       position="88,-8.0000001"
+       id="guide4077" />
+    <sodipodi:guide
+       orientation="0,1"
+       position="-8,84.000001"
+       id="guide4074" />
+    <sodipodi:guide
+       orientation="1,0"
+       position="12,-8.0000001"
+       id="guide4076" />
+    <sodipodi:guide
+       orientation="1,0"
+       position="84,-8.0000001"
+       id="guide4080" />
+    <sodipodi:guide
+       position="48,-8.0000001"
+       orientation="1,0"
+       id="guide4170" />
+    <sodipodi:guide
+       position="-8,48"
+       orientation="0,1"
+       id="guide4172" />
+    <sodipodi:guide
+       position="92,-8.0000001"
+       orientation="1,0"
+       id="guide4760" />
+  </sodipodi:namedview>
+  <metadata
+     id="metadata4879">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title></dc:title>
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <g
+     inkscape:label="Layer 1"
+     inkscape:groupmode="layer"
+     id="layer1"
+     transform="translate(67.857146,-78.50504)">
+    <g
+       transform="matrix(0,-1,-1,0,373.50506,516.50504)"
+       id="g4845"
+       style="display:inline">
+      <g
+         inkscape:export-ydpi="90"
+         inkscape:export-xdpi="90"
+         inkscape:export-filename="next01.png"
+         transform="matrix(-0.9996045,0,0,1,575.94296,-611.00001)"
+         id="g4778"
+         inkscape:label="Layer 1">
+        <g
+           transform="matrix(-1,0,0,1,575.99999,611)"
+           id="g4780"
+           style="display:inline">
+          <rect
+             style="color:#000000;display:inline;overflow:visible;visibility:visible;fill:none;stroke:none;stroke-width:4;marker:none;enable-background:accumulate"
+             id="rect4782"
+             width="96.037987"
+             height="96"
+             x="-438.00244"
+             y="345.36221"
+             transform="scale(-1,1)" />
+          <path
+             style="color:#000000;display:inline;overflow:visible;visibility:visible;fill:#808080;fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:3.00059342;marker:none;enable-background:accumulate"
+             d="m 421.99612,401.93458 0,-17.14379 c 0,0 9.50358,4.04713 16.00635,8.57143 -6.50277,4.5243 -16.00635,8.57236 -16.00635,8.57236 z"
+             id="path4198"
+             inkscape:connector-curvature="0"
+             inkscape:transform-center-x="0.00046899999"
+             inkscape:transform-center-y="8.0000098" />
+          <rect
+             style="color:#000000;display:inline;overflow:visible;visibility:visible;opacity:1;fill:#808080;fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:4.00079155;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker:none;enable-background:accumulate"
+             id="rect4192"
+             width="10.000016"
+             height="10.003973"
+             x="-383.36221"
+             y="-411.99216"
+             transform="matrix(0,-1,-1,0,0,0)" />
+          <ellipse
+             style="color:#000000;display:inline;overflow:visible;visibility:visible;opacity:1;fill:#808080;fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:4.00079155;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker:none;enable-background:accumulate"
+             id="path4194"
+             cx="-408.36221"
+             cy="-393.98505"
+             transform="matrix(0,-1,-1,0,0,0)"
+             rx="5.9999971"
+             ry="6.0023713" />
+          <ellipse
+             ry="7.0027828"
+             rx="7.0000129"
+             transform="matrix(0,-1,-1,0,0,0)"
+             cy="-348.96722"
+             cx="-393.36221"
+             id="ellipse4196"
+             style="color:#000000;display:inline;overflow:visible;visibility:visible;opacity:1;fill:#808080;fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:4.00079155;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker:none;enable-background:accumulate" />
+          <path
+             style="color:#000000;display:inline;overflow:visible;visibility:visible;opacity:1;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#808080;stroke-width:4.00079155;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker:none;enable-background:accumulate"
+             d="m 422.99651,393.36222 -70.02769,0"
+             id="path4199"
+             inkscape:connector-curvature="0" />
+          <path
+             style="color:#000000;display:inline;overflow:visible;visibility:visible;opacity:1;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#808080;stroke-width:4.00079155;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker:none;enable-background:accumulate"
+             d="m 363.97317,393.36222 c 11.00436,0 12.00475,15 22.0087,15 l 4.00159,0"
+             id="path4201"
+             inkscape:connector-curvature="0"
+             sodipodi:nodetypes="ccc" />
+          <path
+             sodipodi:nodetypes="ccc"
+             inkscape:connector-curvature="0"
+             id="path4203"
+             d="m 376.97833,393.36222 c 11.00436,0 12.00475,-15 22.0087,-15 l 4.00159,0"
+             style="color:#000000;display:inline;overflow:visible;visibility:visible;opacity:1;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#808080;stroke-width:4.00079155;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker:none;enable-background:accumulate" />
+        </g>
+      </g>
+    </g>
+  </g>
+</svg>
diff --git a/nymea-app/ui/images/browser/MediaBrowserIconVTuner.svg b/nymea-app/ui/images/browser/MediaBrowserIconVTuner.svg
new file mode 100644
index 00000000..6b293f0e
--- /dev/null
+++ b/nymea-app/ui/images/browser/MediaBrowserIconVTuner.svg
@@ -0,0 +1,78 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="96"
+   height="96"
+   viewBox="0 0 25.399999 25.400001"
+   version="1.1"
+   id="svg8"
+   inkscape:version="0.92.3 (2405546, 2018-03-11)"
+   sodipodi:docname="MediaBrowserIconVTuner.svg">
+  <defs
+     id="defs2" />
+  <sodipodi:namedview
+     id="base"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageopacity="0.0"
+     inkscape:pageshadow="2"
+     inkscape:zoom="5.6"
+     inkscape:cx="7.55591"
+     inkscape:cy="67.715205"
+     inkscape:document-units="mm"
+     inkscape:current-layer="layer1"
+     showgrid="true"
+     units="px"
+     inkscape:window-width="2792"
+     inkscape:window-height="1698"
+     inkscape:window-x="88"
+     inkscape:window-y="44"
+     inkscape:window-maximized="1">
+    <inkscape:grid
+       type="xygrid"
+       id="grid815" />
+  </sodipodi:namedview>
+  <metadata
+     id="metadata5">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title></dc:title>
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <g
+     inkscape:label="Layer 1"
+     inkscape:groupmode="layer"
+     id="layer1"
+     transform="translate(0,-271.59998)">
+    <g
+       id="g868"
+       transform="matrix(0.4384269,0,0,0.4384269,7.5142976,159.08228)"
+       style="stroke-width:2.28088212;fill:#808080;fill-opacity:1">
+      <path
+         sodipodi:nodetypes="ccsscsscccsscccccccccccscscscssscscssccccc"
+         inkscape:connector-curvature="0"
+         id="path864"
+         d="m 20.242078,272.36549 c -0.09168,-0.14834 0.01903,-0.47492 0.24602,-0.72573 1.412216,-1.56048 1.585561,-4.06623 0.432885,-6.2575 -0.919729,-1.74843 -0.912935,-1.71979 -0.408028,-1.71979 0.212146,0 0.718162,0.56554 1.12448,1.25677 0.63124,1.07386 0.738756,1.54557 0.738756,3.24114 0,1.61218 -0.119507,2.19299 -0.637146,3.0966 -0.665059,1.16095 -1.213538,1.5671 -1.496967,1.10851 z m -1.173179,-1.26017 c 0,-0.14787 0.253013,-0.69768 0.56225,-1.2218 0.652,-1.10506 0.584846,-3.01082 -0.134085,-3.80523 -0.534522,-0.59064 -0.551373,-1.09291 -0.03667,-1.09291 0.584975,0 1.460643,1.9374 1.460175,3.23061 -5.3e-4,1.33451 -0.730388,2.94915 -1.388653,3.07187 -0.254661,0.0475 -0.463021,-0.0347 -0.463021,-0.18254 z m -0.915022,-1.52138 c 0.24664,-0.86225 0.24115,-1.66742 -0.02053,-3.01106 l -0.180353,-0.92604 0.577924,0.55649 c 1.045588,1.0068 0.89639,3.65025 -0.22696,4.02118 -0.288679,0.0953 -0.32105,-0.0428 -0.150077,-0.64057 z M 0.58431741,267.55758 c -0.93791991,-1.51758 -1.24490406,-3.1701 -0.89701374,-4.82867 0.33173751,-1.58157 1.19610695,-3.03519 1.80481983,-3.03519 0.4967743,0 0.4781537,0.17249 -0.1098397,1.01749 -0.67198186,0.96569 -1.0999187,2.31794 -1.09299111,3.45376 0.00608,0.9967 0.78750371,3.00664 1.28955571,3.31693 0.4203451,0.25979 0.3600915,0.94307 -0.083162,0.94307 -0.2064126,0 -0.61652839,-0.39033 -0.91136899,-0.86739 z m 1.43985939,-0.78626 c -1.05724754,-1.62143 -0.9824493,-4.63249 0.1403175,-5.64858 0.7715301,-0.69822 0.8859028,-0.25872 0.265942,1.02195 -0.6969541,1.43972 -0.7033731,2.18193 -0.030288,3.50215 0.2910416,0.57086 0.5291666,1.19135 0.5291666,1.37886 0,0.53447 -0.4784513,0.4 -0.9051381,-0.25438 z m 1.3326335,-1.02876 c -0.5011663,-0.71552 -0.5580232,-2.29788 -0.1173202,-3.26512 0.3133976,-0.68783 0.9747756,-0.77792 0.7695047,-0.10482 -0.2939079,0.96376 -0.3044169,2.34842 -0.021831,2.87644 0.4594868,0.85856 -0.07924,1.28032 -0.6303535,0.4935 z"
+         style="fill:#808080;stroke-width:2.28088212;fill-opacity:1" />
+      <path
+         inkscape:connector-curvature="0"
+         id="path862"
+         d="m 9.4116078,311.38647 c -3.8029338,-0.74888 -4.7106928,-1.08372 -7.2175637,-2.6623 -2.86049273,-1.80125 -4.5514697,-3.73503 -6.2357327,-7.13109 -1.2983427,-2.61792 -1.6311197,-4.25432 -1.6066227,-7.9004 0.02257,-3.35947 0.275399,-4.65706 1.3661337,-7.01146 2.048399,-4.42156 5.6507877,-7.70573 10.1613913,-9.2638 2.3569071,-0.81413 2.8409811,-1.07293 3.0114441,-1.61001 0.0821,-0.25868 -0.627196,-2.7667 -1.576219,-5.57337 -1.4445748,-4.27225 -1.6620048,-5.13858 -1.3355171,-5.32129 0.5594041,-0.31306 0.4806411,-0.72112 -0.1391897,-0.72112 -0.627871,0 -0.715154,-0.73898 -0.114507,-0.96947 0.2280627,-0.0875 0.5531357,-0.0206 0.7223848,0.1486 0.169249,0.16925 1.148621,2.85653 2.176382,5.97173 1.6804302,5.09347 1.8208742,5.6765 1.3942822,5.78805 -0.4770002,0.12474 -0.6531542,0.82562 -0.2674223,1.06402 0.113825,0.0703 1.2151523,0.16105 2.4473973,0.20157 3.080031,0.10128 6.761748,1.16151 8.855025,2.55 4.591371,3.04549 7.211516,7.08092 8.10318,12.48014 0.379997,2.30097 0.0076,6.19015 -0.824174,8.60779 -0.697103,2.02617 -2.695787,5.01641 -4.541579,6.7947 -1.992244,1.91938 -5.459817,3.73549 -8.216376,4.30325 -1.870858,0.38533 -4.869371,0.50914 -6.1627172,0.25446 z m 6.5848092,-1.31651 c 6.984493,-1.69345 12.312995,-8.37709 12.328989,-15.46447 0.004,-1.7931 -0.264798,-2.36802 -1.10734,-2.36802 -0.383593,0 -0.476639,0.21877 -0.478247,1.12448 -0.0011,0.61846 -0.125349,1.89838 -0.276109,2.84427 -0.232677,1.45983 -0.411528,1.83977 -1.183201,2.51354 -0.623996,0.54483 -0.98611,1.15158 -1.154697,1.9348 -0.19159,0.89008 -0.60352,1.49018 -1.872888,2.72842 -2.587119,2.52367 -2.880011,2.12265 -2.001694,-2.74066 0.255809,-1.41644 0.395827,-2.7559 0.311152,-2.97656 -0.118422,-0.3086 -0.606435,-0.40121 -2.11424,-0.40121 -1.301584,0 -2.057747,-0.11744 -2.250337,-0.34949 -0.360339,-0.43419 -0.599758,-5.88382 -0.293841,-6.68844 0.123314,-0.32434 0.498917,-0.6765 0.834676,-0.78259 0.335756,-0.10609 0.777097,-0.42971 0.980755,-0.71916 0.330001,-0.46901 0.57468,-0.50951 2.248958,-0.37222 1.678287,0.13762 1.951281,0.24013 2.559399,0.9611 1.019226,1.20837 2.507351,1.0091 1.83574,-0.24581 -0.157368,-0.29405 -0.462282,-0.53464 -0.677582,-0.53464 -0.215302,0 -0.627385,-0.38695 -0.915744,-0.85989 -0.454647,-0.74568 -0.52442,-0.7829 -0.525277,-0.2802 -0.0016,0.88842 -0.45584,0.97058 -0.846452,0.15307 -0.437732,-0.91614 -1.389754,-1.10314 -1.791777,-0.35195 -0.160489,0.29987 -0.52573,0.54522 -0.811652,0.54522 -0.545304,0 -1.578192,-0.86751 -1.578192,-1.32551 0,-0.14694 0.238125,-0.47106 0.529167,-0.72026 0.291041,-0.24919 0.529166,-0.60895 0.529166,-0.79946 0,-0.19051 0.188725,-0.4188 0.419389,-0.50731 0.320333,-0.12293 0.379163,-0.37537 0.24907,-1.06882 -0.09368,-0.49934 -0.232105,-1.06889 -0.307617,-1.26568 -0.278615,-0.72605 0.77539,-0.90943 2.286629,-0.39782 0.791414,0.26792 1.531845,0.4297 1.645405,0.35952 1.136446,-0.70236 -5.602574,-4.55458 -7.497147,-4.28559 -0.37039,0.0526 -0.769585,0.387 -0.974876,0.81666 -0.309036,0.6468 -0.490979,0.7276 -1.638294,0.7276 -1.07043,0 -1.32014,0.0929 -1.463483,0.54455 -0.127731,0.40245 -0.356782,0.52328 -0.877725,0.46302 -0.6395462,-0.074 -0.7123692,-0.19803 -0.7855352,-1.3383 -0.07569,-1.17957 -0.125961,-1.25677 -0.818475,-1.25677 -0.79861,0 -3.2536058,0.77949 -4.2835857,1.36008 -0.987005,0.55637 -2.093339,1.61164 -2.093339,1.99672 0,0.4466 0.577674,0.4346 2.3812499,-0.0495 1.8919868,-0.50783 3.7041668,-0.52354 3.7041668,-0.0321 0,0.41893 -1.008856,0.85223 -2.4499088,1.05222 -1.235755,0.1715 -2.5771739,1.09592 -2.5771739,1.77602 0,0.75104 0.569494,0.62754 1.3229159,-0.2869 0.516988,-0.62748 0.942746,-0.83713 1.9493278,-0.95987 1.539704,-0.18776 1.809769,0.0903 1.578975,1.62563 -0.221849,1.47583 -0.690122,1.89937 -2.3259968,2.10376 -1.7339249,0.21663 -2.2128639,0.69958 -2.5009229,2.52182 -0.21049,1.33156 -0.56664,1.84399 -1.287619,1.85266 -0.185503,0.002 -0.450446,0.3017 -0.588764,0.66551 -0.304306,0.80038 -1.20266273,0.8853 -1.39957973,0.13229 -0.153613,-0.58742 -0.96444797,-0.70514 -1.45791997,-0.21167 -0.174625,0.17463 -0.3175,0.62939 -0.3175,1.01059 0,0.52786 0.204937,0.7833 0.85968797,1.07156 0.472829,0.20816 0.90236,0.6166 0.954513,0.90764 0.178778,0.99767 0.567633,1.14606 3.50140373,1.33621 2.5262996,0.16374 2.9555277,0.26042 3.2926137,0.74168 0.213188,0.30437 0.387615,0.80998 0.387615,1.12359 0,0.82182 0.466252,1.08399 2.166774,1.21837 2.1830102,0.1725 2.3311432,0.37187 2.3311432,3.13756 0,2.48879 -0.05525,2.59986 -1.432113,2.87924 -0.7382652,0.1498 -0.8295722,0.27936 -0.9491372,1.34684 -0.100655,0.89864 -0.274658,1.24356 -0.727604,1.44227 -0.481535,0.21126 -0.595313,0.47376 -0.595313,1.37345 0,0.61175 0.148828,1.20551 0.330729,1.31946 1.017481,0.63741 4.9373242,0.60154 7.7092892,-0.0706 z M 0.93069207,293.00816 c -0.09777,-0.1582 -0.06624,-0.39916 0.07006,-0.53547 0.350912,-0.35091 2.156586,-0.37761 2.49727,-0.0369 0.49417,0.49417 -0.02916,0.86004 -1.23017,0.86004 -0.637667,0 -1.239391,-0.12944 -1.33717046,-0.28764 z M 17.008456,283.45661 c -0.438673,-0.43867 -0.407458,-1.53789 0.04367,-1.53789 0.510106,0 1.019153,0.68055 0.91414,1.22213 -0.112879,0.58214 -0.547989,0.72558 -0.957813,0.31576 z m -3.098932,-3.12539 c -0.239133,-0.38693 0.09129,-0.79375 0.644676,-0.79375 0.539811,0 1.164489,0.61618 0.896432,0.88424 -0.269407,0.2694 -1.358191,0.20547 -1.541108,-0.0905 z m -9.029978,25.88534 c -0.503998,-2.51163 -1.0010879,-3.39576 -1.9092229,-3.39576 -0.839105,0 -1.415868,-0.96516 -2.01275003,-3.36816 -0.5310077,-2.1378 -0.6440517,-2.35076 -1.4366587,-2.70646 -0.59635697,-0.26762 -0.90687997,-0.61897 -1.01211997,-1.14517 -0.09254,-0.4627 -0.389282,-0.84938 -0.759979,-0.99032 -0.580056,-0.22054 -1.216021,-1.05751 -1.141741,-1.50261 0.213445,-1.27899 -0.935036,-1.64557 -1.276989,-0.40759 -0.8091817,2.92949 0.793002,8.32179 3.495795,11.76542 1.71164797,2.18082 5.7392026,5.02704 6.3082686,4.45797 0.14417,-0.14416 0.04224,-1.22801 -0.254603,-2.70732 z m 8.588232,-31.09071 c -0.396885,-0.10503 -0.4055,-0.22955 -0.08483,-1.22608 0.196302,-0.61005 0.620027,-1.97238 0.941607,-3.02741 0.510384,-1.67443 0.664078,-1.91823 1.209313,-1.91823 0.378828,0 0.624618,-0.15617 0.624618,-0.39687 0,-0.21828 -0.178594,-0.39688 -0.396876,-0.39688 -0.492553,0 -0.525748,-0.68768 -0.04215,-0.87325 0.195099,-0.0749 0.514808,-0.0372 0.710467,0.0837 0.38199,0.23608 0.234154,0.93412 -1.217874,5.75045 -0.639025,2.11963 -0.76449,2.26381 -1.744269,2.00453 z"
+         style="fill:#808080;stroke-width:2.28088212;fill-opacity:1" />
+    </g>
+  </g>
+</svg>
diff --git a/nymea-app/ui/images/browser/MediaBrowserIconVideoLibrary.svg b/nymea-app/ui/images/browser/MediaBrowserIconVideoLibrary.svg
new file mode 120000
index 00000000..e7788653
--- /dev/null
+++ b/nymea-app/ui/images/browser/MediaBrowserIconVideoLibrary.svg
@@ -0,0 +1 @@
+BrowserIconVideo.svg
\ No newline at end of file
diff --git a/nymea-app/ui/mainviews/DevicesPageDelegate.qml b/nymea-app/ui/mainviews/DevicesPageDelegate.qml
index da93c081..a93fc9c4 100644
--- a/nymea-app/ui/mainviews/DevicesPageDelegate.qml
+++ b/nymea-app/ui/mainviews/DevicesPageDelegate.qml
@@ -13,6 +13,14 @@ MainPageTile {
     disconnected: devicesSubProxyConnectables.count > 0
     batteryCritical: devicesSubProxyBattery.count > 0
 
+    backgroundImage: currentDevice.deviceClass.interfaces.indexOf("mediametadataprovider") >= 0 ?
+                         currentDevice.states.getState(currentDevice.deviceClass.stateTypes.findByName("artwork").id).value : ""
+
+    property int currentDeviceIndex: 0
+    readonly property Device currentDevice: devicesProxy.get(currentDeviceIndex)
+//    readonly property State currentBackgroundState: currentDevice.state
+
+
     onClicked: {
         var page;
         switch (model.name) {