diff --git a/frontend/project.clj b/frontend/project.clj
index 6a4201d8c..6b5f44fa7 100644
--- a/frontend/project.clj
+++ b/frontend/project.clj
@@ -18,11 +18,12 @@
 
                  ;; Runtime
                  [com.cognitect/transit-cljs "0.8.239"]
+
+                 [funcool/rumext "1.0.0"]
                  [rum "0.10.8" :exclusions [cljsjs/react cljsjs/react-dom]]
-                 ;; [cljsjs/react-with-addons "15.4.2-2"]
-                 [cljsjs/react "15.4.2-2"]
-                 [cljsjs/react-dom "15.4.2-2"]
-                 [cljsjs/react-dom-server "15.4.2-2"]
+                 [cljsjs/react "15.5.0-0"]
+                 [cljsjs/react-dom "15.5.0-0"]
+                 [cljsjs/react-dom-server "15.5.0-0"]
 
                  [funcool/beicon "3.2.0"]
                  [funcool/bide "1.4.0"]
diff --git a/frontend/src/uxbox/main/data/workspace/ruler.cljs b/frontend/src/uxbox/main/data/workspace/ruler.cljs
index bc80123bd..6ca188f62 100644
--- a/frontend/src/uxbox/main/data/workspace/ruler.cljs
+++ b/frontend/src/uxbox/main/data/workspace/ruler.cljs
@@ -12,7 +12,7 @@
             [uxbox.main.refs :as refs]
             [uxbox.main.streams :as streams]
             [uxbox.main.user-events :as uev]
-            [uxbox.util.mixins :as mx :include-macros true]
+            [rumext.core :as mx :include-macros true]
             [uxbox.util.dom :as dom]
             [uxbox.util.geom.point :as gpt]))
 
diff --git a/frontend/src/uxbox/main/data/workspace/scroll.cljs b/frontend/src/uxbox/main/data/workspace/scroll.cljs
index fcbba87c2..9930ba6f1 100644
--- a/frontend/src/uxbox/main/data/workspace/scroll.cljs
+++ b/frontend/src/uxbox/main/data/workspace/scroll.cljs
@@ -11,7 +11,7 @@
             [potok.core :as ptk]
             [uxbox.main.refs :as refs]
             [uxbox.main.streams :as streams]
-            [uxbox.util.mixins :as mx :include-macros true]
+            [rumext.core :as mx :include-macros true]
             [uxbox.util.dom :as dom]
             [uxbox.util.geom.point :as gpt]))
 
diff --git a/frontend/src/uxbox/main/exports.cljs b/frontend/src/uxbox/main/exports.cljs
index f646dc91a..9557e5100 100644
--- a/frontend/src/uxbox/main/exports.cljs
+++ b/frontend/src/uxbox/main/exports.cljs
@@ -14,7 +14,7 @@
             [uxbox.main.ui.shapes.path :refer [path-shape]]
             [uxbox.main.ui.shapes.circle :refer [circle-shape]]
             [uxbox.main.ui.shapes.image :refer [image-shape]]
-            [uxbox.util.mixins :as mx :include-macros true]))
+            [rumext.core :as mx :include-macros true]))
 
 (def ^:dynamic *state* st/state)
 
diff --git a/frontend/src/uxbox/main/ui.cljs b/frontend/src/uxbox/main/ui.cljs
index 164ccee23..de74d632d 100644
--- a/frontend/src/uxbox/main/ui.cljs
+++ b/frontend/src/uxbox/main/ui.cljs
@@ -29,7 +29,7 @@
             [uxbox.util.i18n :refer [tr]]
             [uxbox.util.data :refer [parse-int uuid-str?]]
             [uxbox.util.dom :as dom]
-            [uxbox.util.mixins :as mx :include-macros true]))
+            [rumext.core :as mx :include-macros true]))
 
 ;; --- Constants
 
diff --git a/frontend/src/uxbox/main/ui/auth/login.cljs b/frontend/src/uxbox/main/ui/auth/login.cljs
index 2bb241b9e..4c05d84e1 100644
--- a/frontend/src/uxbox/main/ui/auth/login.cljs
+++ b/frontend/src/uxbox/main/ui/auth/login.cljs
@@ -17,7 +17,7 @@
             [uxbox.main.ui.navigation :as nav]
             [uxbox.util.dom :as dom]
             [uxbox.util.forms :as fm]
-            [uxbox.util.mixins :as mx :include-macros true]
+            [rumext.core :as mx :include-macros true]
             [uxbox.util.router :as rt]))
 
 (def form-data (fm/focus-data :login st/state))
diff --git a/frontend/src/uxbox/main/ui/auth/recovery.cljs b/frontend/src/uxbox/main/ui/auth/recovery.cljs
index bc82f88f7..601e41076 100644
--- a/frontend/src/uxbox/main/ui/auth/recovery.cljs
+++ b/frontend/src/uxbox/main/ui/auth/recovery.cljs
@@ -16,7 +16,7 @@
             [uxbox.main.ui.navigation :as nav]
             [uxbox.util.dom :as dom]
             [uxbox.util.forms :as fm]
-            [uxbox.util.mixins :as mx :include-macros true]
+            [rumext.core :as mx :include-macros true]
             [uxbox.util.router :as rt]))
 
 (def form-data (fm/focus-data :recovery st/state))
diff --git a/frontend/src/uxbox/main/ui/auth/recovery_request.cljs b/frontend/src/uxbox/main/ui/auth/recovery_request.cljs
index a0c53a65d..1d36e913b 100644
--- a/frontend/src/uxbox/main/ui/auth/recovery_request.cljs
+++ b/frontend/src/uxbox/main/ui/auth/recovery_request.cljs
@@ -16,7 +16,7 @@
             [uxbox.main.ui.navigation :as nav]
             [uxbox.util.dom :as dom]
             [uxbox.util.forms :as fm]
-            [uxbox.util.mixins :as mx :include-macros true]
+            [rumext.core :as mx :include-macros true]
             [uxbox.util.router :as rt]))
 
 (def form-data (fm/focus-data :recovery-request st/state))
diff --git a/frontend/src/uxbox/main/ui/auth/register.cljs b/frontend/src/uxbox/main/ui/auth/register.cljs
index 66c4fe8b5..2a9a2f2b8 100644
--- a/frontend/src/uxbox/main/ui/auth/register.cljs
+++ b/frontend/src/uxbox/main/ui/auth/register.cljs
@@ -16,7 +16,7 @@
             [uxbox.main.ui.navigation :as nav]
             [uxbox.util.dom :as dom]
             [uxbox.util.forms :as fm]
-            [uxbox.util.mixins :as mx :include-macros true]
+            [rumext.core :as mx :include-macros true]
             [uxbox.util.router :as rt]))
 
 (def form-data (fm/focus-data :register st/state))
diff --git a/frontend/src/uxbox/main/ui/colorpicker.cljs b/frontend/src/uxbox/main/ui/colorpicker.cljs
index 6f3d6fbba..c8553d083 100644
--- a/frontend/src/uxbox/main/ui/colorpicker.cljs
+++ b/frontend/src/uxbox/main/ui/colorpicker.cljs
@@ -5,12 +5,10 @@
 ;; Copyright (c) 2016 Andrey Antukh <niwi@niwi.nz>
 
 (ns uxbox.main.ui.colorpicker
-  (:require [sablono.core :as html :refer-macros [html]]
-            [rum.core :as rum]
-            [lentes.core :as l]
+  (:require [lentes.core :as l]
             [goog.events :as events]
             [uxbox.util.forms :as sc]
-            [uxbox.util.mixins :as mx :include-macros true]
+            [rumext.core :as mx :include-macros true]
             [uxbox.util.math :as mth]
             [uxbox.util.data :as data]
             [uxbox.util.dom :as dom]
@@ -19,53 +17,45 @@
 
 ;; --- Picker Box
 
-(defn- picker-box-render
-  [own]
-  (html
-   [:svg {:width "100%" :height "100%" :version "1.1"}
-    [:defs
-     [:linearGradient {:id "gradient-black"
-                       :x1 "0%" :y1 "100%"
-                       :x2 "0%" :y2 "0%"}
-      [:stop {:offset "0%" :stopColor "#000000" :stopOpacity "1"}]
-      [:stop {:offset "100%" :stopColor "#CC9A81" :stopOpacity "0"}]]
-     [:linearGradient {:id "gradient-white"
-                       :x1 "0%" :y1 "100%"
-                       :x2 "100%" :y2 "100%"}
-      [:stop {:offset "0%" :stopColor "#FFFFFF" :stopOpacity "1"}]
-      [:stop {:offset "100%" :stopColor "#CC9A81" :stopOpacity "0"}]]]
-    [:rect {:x "0" :y "0" :width "100%" :height "100%"
-            :fill "url(#gradient-white)"}]
-    [:rect {:x "0" :y "0" :width "100%" :height "100%"
-            :fill "url(#gradient-black)"}]]))
-
-(def picker-box
-  (mx/component
-   {:render picker-box-render
-    :name "picker-box"
-    :mixins []}))
+(mx/defc picker-box
+  []
+  [:svg {:width "100%" :height "100%" :version "1.1"}
+   [:defs
+    [:linearGradient {:id "gradient-black"
+                      :x1 "0%" :y1 "100%"
+                      :x2 "0%" :y2 "0%"}
+     [:stop {:offset "0%" :stopColor "#000000" :stopOpacity "1"}]
+     [:stop {:offset "100%" :stopColor "#CC9A81" :stopOpacity "0"}]]
+    [:linearGradient {:id "gradient-white"
+                      :x1 "0%" :y1 "100%"
+                      :x2 "100%" :y2 "100%"}
+     [:stop {:offset "0%" :stopColor "#FFFFFF" :stopOpacity "1"}]
+     [:stop {:offset "100%" :stopColor "#CC9A81" :stopOpacity "0"}]]]
+   [:rect {:x "0" :y "0" :width "100%" :height "100%"
+           :fill "url(#gradient-white)"}]
+   [:rect {:x "0" :y "0" :width "100%" :height "100%"
+           :fill "url(#gradient-black)"}]])
 
 ;; --- Slider Box
 
-(defn slider-box-render
-  [own]
-  (html
-   [:svg {:width "100%" :height "100%" :version "1.1"}
-    [:defs
-     [:linearGradient {:id "gradient-hsv"
-                       :x1 "0%" :y1 "100%"
-                       :x2 "0%" :y2 "0%"}
-      [:stop {:offset "0%" :stopColor "#FF0000" :stopOpacity "1"}]
-      [:stop {:offset "13%" :stopColor "#FF00FF" :stopOpacity "1"}]
-      [:stop {:offset "25%" :stopColor "#8000FF" :stopOpacity "1"}]
-      [:stop {:offset "38%" :stopColor "#0040FF" :stopOpacity "1"}]
-      [:stop {:offset "50%" :stopColor "#00FFFF" :stopOpacity "1"}]
-      [:stop {:offset "63%" :stopColor "#00FF40" :stopOpacity "1"}]
-      [:stop {:offset "75%" :stopColor "#0BED00" :stopOpacity "1"}]
-      [:stop {:offset "88%" :stopColor "#FFFF00" :stopOpacity "1"}]
-      [:stop {:offset "100%" :stopColor "#FF0000" :stopOpacity "1"}]]]
-    [:rect {:x 0 :y 0 :width "100%" :height "100%"
-            :fill "url(#gradient-hsv)"}]]))
+(mx/defc slider-box
+  []
+  [:svg {:width "100%" :height "100%" :version "1.1"}
+   [:defs
+    [:linearGradient {:id "gradient-hsv"
+                      :x1 "0%" :y1 "100%"
+                      :x2 "0%" :y2 "0%"}
+     [:stop {:offset "0%" :stopColor "#FF0000" :stopOpacity "1"}]
+     [:stop {:offset "13%" :stopColor "#FF00FF" :stopOpacity "1"}]
+     [:stop {:offset "25%" :stopColor "#8000FF" :stopOpacity "1"}]
+     [:stop {:offset "38%" :stopColor "#0040FF" :stopOpacity "1"}]
+     [:stop {:offset "50%" :stopColor "#00FFFF" :stopOpacity "1"}]
+     [:stop {:offset "63%" :stopColor "#00FF40" :stopOpacity "1"}]
+     [:stop {:offset "75%" :stopColor "#0BED00" :stopOpacity "1"}]
+     [:stop {:offset "88%" :stopColor "#FFFF00" :stopOpacity "1"}]
+     [:stop {:offset "100%" :stopColor "#FF0000" :stopOpacity "1"}]]]
+   [:rect {:x 0 :y 0 :width "100%" :height "100%"
+           :fill "url(#gradient-hsv)"}]])
 
 (def default-dimensions
   {:pi-height 5
@@ -83,12 +73,6 @@
    :p-width 170
    :s-height 170})
 
-(def slider-box
-  (mx/component
-   {:render slider-box-render
-    :name "slider-box"
-    :mixins []}))
-
 ;; --- Color Picker
 
 (defn- on-picker-click
@@ -116,11 +100,11 @@
     (swap! local assoc :color hsv)
     (on-change hex)))
 
-(defn- colorpicker-render
-  [own & {:keys [value on-change theme]
-          :or {value "#d4edfb" theme :default}}]
-  (let [local (:rum/local own)
-        value-rgb (color/hex->rgb value)
+(mx/defcs colorpicker
+  {:mixins [mx/static (mx/local)]}
+  [{:keys [rum/local] :as own} & {:keys [value on-change theme]
+                                  :or {value "#d4edfb" theme :default}}]
+  (let [value-rgb (color/hex->rgb value)
         classes (case theme
                   :default "theme-default"
                   :small "theme-small")
@@ -161,68 +145,59 @@
                     hex (color/rgb->hex rgb)]
                 (when (color/hex? hex)
                   (on-change hex))))]
-      (html
-       [:div.color-picker {:class classes}
-        [:div.picker-area
-         #_[:div.tester {:style {:width "100px" :height "100px"
-                                 :border "1px solid black"
-                                 :position "fixed" :top "50px" :left "50px"
-                                 :backgroundColor (color/hsv->hex color)}}]
-         [:div.picker-wrapper
-          [:div.picker
-           {:ref "picker"
-            :on-click (partial on-picker-click local dimensions on-change color)
-            :on-mouse-down on-mouse-down
-            :on-mouse-up on-mouse-up
-            :on-mouse-move on-mouse-move-picker
-            :style {:backgroundColor bg}}
-           (picker-box)]
-          (when-not (:mousedown @local)
+      [:div.color-picker {:class classes}
+       [:div.picker-area
+        #_[:div.tester {:style {:width "100px" :height "100px"
+                                :border "1px solid black"
+                                :position "fixed" :top "50px" :left "50px"
+                                :backgroundColor (color/hsv->hex color)}}]
+        [:div.picker-wrapper
+         [:div.picker
+          {:ref "picker"
+           :on-click (partial on-picker-click local dimensions on-change color)
+           :on-mouse-down on-mouse-down
+           :on-mouse-up on-mouse-up
+           :on-mouse-move on-mouse-move-picker
+           :style {:backgroundColor bg}}
+          (picker-box)]
+         (when-not (:mousedown @local)
            [:div.picker-indicator
             {:ref "picker-indicator"
              :style {:top (str pil "px")
                      :left (str pit "px")
                      :pointerEvents "none"}}])]
-         [:div.slide-wrapper
-          [:div.slide
-           {:ref "slide"
-            :on-mouse-down on-mouse-down
-            :on-mouse-up on-mouse-up
-            :on-mouse-move on-mouse-move-slide
-            :on-click (partial on-slide-click local dimensions on-change color)}
-           (slider-box)]
-          [:div.slide-indicator
-           {:ref "slide-indicator"
-            :style {:top (str sit "px")
-                    :pointerEvents "none"}}]]]
+        [:div.slide-wrapper
+         [:div.slide
+          {:ref "slide"
+           :on-mouse-down on-mouse-down
+           :on-mouse-up on-mouse-up
+           :on-mouse-move on-mouse-move-slide
+           :on-click (partial on-slide-click local dimensions on-change color)}
+          (slider-box)]
+         [:div.slide-indicator
+          {:ref "slide-indicator"
+           :style {:top (str sit "px")
+                   :pointerEvents "none"}}]]]
 
-        [:div.inputs-area
+       [:div.inputs-area
+        [:input.input-text
+         {:placeholder "#"
+          :type "text"
+          :value value
+          :on-change on-hex-changed}]
+        [:div.row-flex
          [:input.input-text
-          {:placeholder "#"
-           :type "text"
-           :value value
-           :on-change on-hex-changed}]
-         [:div.row-flex
-          [:input.input-text
-           {:placeholder "R"
-            :on-change (partial on-rgb-change value-rgb 0)
-            :value (nth value-rgb 0)
-            :type "number"}]
-          [:input.input-text
-           {:placeholder "G"
-            :on-change (partial on-rgb-change value-rgb 1)
-            :value (nth value-rgb 1)
-            :type "number"}]
-          [:input.input-text
-           {:placeholder "B"
-            :on-change (partial on-rgb-change value-rgb 2)
-            :value (nth value-rgb 2)
-            :type "number"}]]]]))))
-
-
-
-(def colorpicker
-  (mx/component
-   {:render colorpicker-render
-    :name "colorpicker"
-    :mixins [mx/static (mx/local)]}))
+          {:placeholder "R"
+           :on-change (partial on-rgb-change value-rgb 0)
+           :value (nth value-rgb 0)
+           :type "number"}]
+         [:input.input-text
+          {:placeholder "G"
+           :on-change (partial on-rgb-change value-rgb 1)
+           :value (nth value-rgb 1)
+           :type "number"}]
+         [:input.input-text
+          {:placeholder "B"
+           :on-change (partial on-rgb-change value-rgb 2)
+           :value (nth value-rgb 2)
+           :type "number"}]]]])))
diff --git a/frontend/src/uxbox/main/ui/confirm.cljs b/frontend/src/uxbox/main/ui/confirm.cljs
index dd8323bed..58fa282d3 100644
--- a/frontend/src/uxbox/main/ui/confirm.cljs
+++ b/frontend/src/uxbox/main/ui/confirm.cljs
@@ -6,15 +6,14 @@
 ;; Copyright (c) 2016 Juan de la Cruz <delacruzgarciajuan@gmail.com>
 
 (ns uxbox.main.ui.confirm
-  (:require [sablono.core :as html :refer-macros [html]]
-            [uxbox.main.data.lightbox :as udl]
+  (:require [uxbox.main.data.lightbox :as udl]
             [uxbox.builtins.icons :as i]
-            [uxbox.util.mixins :as mx :include-macros true]
+            [rumext.core :as mx :include-macros true]
             [uxbox.util.dom :as dom]
             [uxbox.main.ui.lightbox :as lbx]))
 
-(defn- confirm-dialog-render
-  [own {:keys [on-accept on-cancel hint] :as ctx}]
+(mx/defc confirm-dialog
+  [{:keys [on-accept on-cancel hint] :as ctx}]
   (letfn [(accept [event]
             (dom/prevent-default event)
             (udl/close!)
@@ -24,29 +23,22 @@
             (udl/close!)
             (when on-cancel
               (on-cancel (dissoc ctx :on-accept :on-cancel))))]
-    (html
-     [:div.lightbox-body.confirm-dialog
-      [:h3 "Are you sure?"]
-      (if hint
-        [:span hint])
-      [:div.row-flex
-       [:input.btn-success.btn-small
-        {:type "button"
-         :value "Ok"
-         :on-click accept}]
-       [:input.btn-delete.btn-small
-        {:type "button"
-         :value "Cancel"
-         :on-click cancel}]]
-         [:a.close {:href "#"
+    [:div.lightbox-body.confirm-dialog
+     [:h3 "Are you sure?"]
+     (if hint
+       [:span hint])
+     [:div.row-flex
+      [:input.btn-success.btn-small
+       {:type "button"
+        :value "Ok"
+        :on-click accept}]
+      [:input.btn-delete.btn-small
+       {:type "button"
+        :value "Cancel"
+        :on-click cancel}]]
+     [:a.close {:href "#"
                 :on-click #(do (dom/prevent-default %)
-                               (udl/close!))} i/close]])))
-
-(def confirm-dialog
-  (mx/component
-   {:render confirm-dialog-render
-    :name "confirm-dialog"
-    :mixins []}))
+                               (udl/close!))} i/close]]))
 
 (defmethod lbx/render-lightbox :confirm
   [context]
diff --git a/frontend/src/uxbox/main/ui/dashboard/colors.cljs b/frontend/src/uxbox/main/ui/dashboard/colors.cljs
index a798d2da1..2da51147d 100644
--- a/frontend/src/uxbox/main/ui/dashboard/colors.cljs
+++ b/frontend/src/uxbox/main/ui/dashboard/colors.cljs
@@ -23,7 +23,7 @@
             [uxbox.util.dom :as dom]
             [uxbox.util.i18n :as t :refer (tr)]
             [uxbox.util.lens :as ul]
-            [uxbox.util.mixins :as mx :include-macros true]))
+            [rumext.core :as mx :include-macros true]))
 
 ;; --- Refs
 
diff --git a/frontend/src/uxbox/main/ui/dashboard/elements.cljs b/frontend/src/uxbox/main/ui/dashboard/elements.cljs
index b621a70a6..faeb88527 100644
--- a/frontend/src/uxbox/main/ui/dashboard/elements.cljs
+++ b/frontend/src/uxbox/main/ui/dashboard/elements.cljs
@@ -12,7 +12,7 @@
             [uxbox.main.data.dashboard :as dd]
             [uxbox.main.data.lightbox :as udl]
             [uxbox.builtins.icons :as i]
-            [uxbox.util.mixins :as mx :include-macros true]
+            [rumext.core :as mx :include-macros true]
             [uxbox.main.ui.lightbox :as lbx]
             [uxbox.main.ui.dashboard.header :refer (header)]
             [uxbox.util.dom :as dom]))
diff --git a/frontend/src/uxbox/main/ui/dashboard/header.cljs b/frontend/src/uxbox/main/ui/dashboard/header.cljs
index 979b56e1f..efdf95085 100644
--- a/frontend/src/uxbox/main/ui/dashboard/header.cljs
+++ b/frontend/src/uxbox/main/ui/dashboard/header.cljs
@@ -14,7 +14,7 @@
             [uxbox.main.ui.users :as ui.u]
             [uxbox.util.i18n :refer (tr)]
             [uxbox.util.router :as r]
-            [uxbox.util.mixins :as mx :include-macros true]
+            [rumext.core :as mx :include-macros true]
             [potok.core :as ptk]))
 
 (def header-ref
diff --git a/frontend/src/uxbox/main/ui/dashboard/icons.cljs b/frontend/src/uxbox/main/ui/dashboard/icons.cljs
index 40237526d..cc5a093fc 100644
--- a/frontend/src/uxbox/main/ui/dashboard/icons.cljs
+++ b/frontend/src/uxbox/main/ui/dashboard/icons.cljs
@@ -18,7 +18,7 @@
             [uxbox.main.ui.keyboard :as kbd]
             [uxbox.util.i18n :as t :refer (tr)]
             [uxbox.util.data :refer (read-string)]
-            [uxbox.util.mixins :as mx :include-macros true]
+            [rumext.core :as mx :include-macros true]
             [uxbox.util.time :as dt]
             [potok.core :as ptk]
             [uxbox.util.forms :as sc]
diff --git a/frontend/src/uxbox/main/ui/dashboard/images.cljs b/frontend/src/uxbox/main/ui/dashboard/images.cljs
index bb06ec04f..aab6c2b69 100644
--- a/frontend/src/uxbox/main/ui/dashboard/images.cljs
+++ b/frontend/src/uxbox/main/ui/dashboard/images.cljs
@@ -14,7 +14,7 @@
             [uxbox.main.data.lightbox :as udl]
             [uxbox.main.data.images :as di]
             [uxbox.builtins.icons :as i]
-            [uxbox.util.mixins :as mx :include-macros true]
+            [rumext.core :as mx :include-macros true]
             [uxbox.main.ui.lightbox :as lbx]
             [uxbox.main.ui.keyboard :as kbd]
             [uxbox.main.ui.dashboard.header :refer [header]]
diff --git a/frontend/src/uxbox/main/ui/dashboard/projects.cljs b/frontend/src/uxbox/main/ui/dashboard/projects.cljs
index 77c5ac384..8f1aecacb 100644
--- a/frontend/src/uxbox/main/ui/dashboard/projects.cljs
+++ b/frontend/src/uxbox/main/ui/dashboard/projects.cljs
@@ -24,7 +24,7 @@
             [uxbox.util.data :refer [read-string]]
             [uxbox.util.dom :as dom]
             [uxbox.util.blob :as blob]
-            [uxbox.util.mixins :as mx :include-macros true]
+            [rumext.core :as mx :include-macros true]
             [uxbox.util.time :as dt]))
 
 ;; --- Helpers & Constants
diff --git a/frontend/src/uxbox/main/ui/dashboard/projects_createform.cljs b/frontend/src/uxbox/main/ui/dashboard/projects_createform.cljs
index 143dfb1a5..6bf9d1702 100644
--- a/frontend/src/uxbox/main/ui/dashboard/projects_createform.cljs
+++ b/frontend/src/uxbox/main/ui/dashboard/projects_createform.cljs
@@ -20,7 +20,7 @@
             [uxbox.util.forms :as fm]
             [uxbox.util.i18n :as t :refer [tr]]
             [uxbox.util.router :as r]
-            [uxbox.util.mixins :as mx :include-macros true]
+            [rumext.core :as mx :include-macros true]
             [uxbox.util.time :as dt]))
 
 (def form-data (fm/focus-data :create-project st/state))
diff --git a/frontend/src/uxbox/main/ui/lightbox.cljs b/frontend/src/uxbox/main/ui/lightbox.cljs
index b79f263be..7aba81c7c 100644
--- a/frontend/src/uxbox/main/ui/lightbox.cljs
+++ b/frontend/src/uxbox/main/ui/lightbox.cljs
@@ -1,13 +1,11 @@
 (ns uxbox.main.ui.lightbox
-  (:require [sablono.core :as html :refer-macros [html]]
-            [rum.core :as rum]
-            [lentes.core :as l]
+  (:require [lentes.core :as l]
             [uxbox.main.store :as st]
             [uxbox.main.data.lightbox :as udl]
-            [uxbox.util.mixins :as mx :include-macros true]
+            [rumext.core :as mx :include-macros true]
             [uxbox.main.ui.keyboard :as k]
             [uxbox.util.dom :as dom]
-            [uxbox.util.data :refer (classnames)]
+            [uxbox.util.data :refer [classnames]]
             [goog.events :as events])
   (:import goog.events.EventType))
 
@@ -47,23 +45,17 @@
   (events/unlistenByKey (::key own))
   (dissoc own ::key))
 
-(defn- lightbox-render
+(mx/defcs lightbox
+  {:mixins [mx/reactive]
+   :will-mount lightbox-will-mount
+   :will-unmount lightbox-will-umount}
   [own]
   (let [data (mx/react lightbox-ref)
         classes (classnames
                  :hide (nil? data)
                  :transparent (:transparent? data))]
-    (html
-     [:div.lightbox
-      {:class classes
-       :ref "parent"
-       :on-click (partial on-out-clicked own)}
-      (render-lightbox data)])))
-
-(def lightbox
-  (mx/component
-   {:name "lightbox"
-    :render lightbox-render
-    :will-mount lightbox-will-mount
-    :will-unmount lightbox-will-umount
-    :mixins [mx/reactive]}))
+    [:div.lightbox
+     {:class classes
+      :ref "parent"
+      :on-click (partial on-out-clicked own)}
+     (render-lightbox data)]))
diff --git a/frontend/src/uxbox/main/ui/loader.cljs b/frontend/src/uxbox/main/ui/loader.cljs
index f393d62ea..984004ca7 100644
--- a/frontend/src/uxbox/main/ui/loader.cljs
+++ b/frontend/src/uxbox/main/ui/loader.cljs
@@ -7,7 +7,7 @@
 (ns uxbox.main.ui.loader
   (:require [uxbox.main.store :as st]
             [uxbox.builtins.icons :as i]
-            [uxbox.util.mixins :as mx :include-macros true]))
+            [rumext.core :as mx :include-macros true]))
 
 ;; --- Component
 
diff --git a/frontend/src/uxbox/main/ui/messages.cljs b/frontend/src/uxbox/main/ui/messages.cljs
index db2959ded..ae72ed269 100644
--- a/frontend/src/uxbox/main/ui/messages.cljs
+++ b/frontend/src/uxbox/main/ui/messages.cljs
@@ -2,7 +2,7 @@
   (:require [lentes.core :as l]
             [uxbox.main.store :as st]
             [uxbox.util.messages :as uum]
-            [uxbox.util.mixins :as mx :include-macros true]))
+            [rumext.core :as mx :include-macros true]))
 
 (def ^:private message-ref
   (-> (l/key :message)
diff --git a/frontend/src/uxbox/main/ui/settings.cljs b/frontend/src/uxbox/main/ui/settings.cljs
index a439ca0c6..57bb0893b 100644
--- a/frontend/src/uxbox/main/ui/settings.cljs
+++ b/frontend/src/uxbox/main/ui/settings.cljs
@@ -12,7 +12,7 @@
             [uxbox.util.router :as r]
             [potok.core :as ptk]
             [uxbox.builtins.icons :as i]
-            [uxbox.util.mixins :as mx :include-macros true]
+            [rumext.core :as mx :include-macros true]
             [uxbox.util.dom :as dom]
             [uxbox.main.ui.settings.profile :as profile]
             [uxbox.main.ui.settings.password :as password]
diff --git a/frontend/src/uxbox/main/ui/settings/header.cljs b/frontend/src/uxbox/main/ui/settings/header.cljs
index c5368d00c..579dd5bb5 100644
--- a/frontend/src/uxbox/main/ui/settings/header.cljs
+++ b/frontend/src/uxbox/main/ui/settings/header.cljs
@@ -2,55 +2,46 @@
 ;; License, v. 2.0. If a copy of the MPL was not distributed with this
 ;; file, You can obtain one at http://mozilla.org/MPL/2.0/.
 ;;
-;; Copyright (c) 2015-2016 Andrey Antukh <niwi@niwi.nz>
-;; Copyright (c) 2015-2016 Juan de la Cruz <delacruzgarciajuan@gmail.com>
+;; Copyright (c) 2015-2017 Andrey Antukh <niwi@niwi.nz>
+;; Copyright (c) 2015-2017 Juan de la Cruz <delacruzgarciajuan@gmail.com>
 
 (ns uxbox.main.ui.settings.header
-  (:require [sablono.core :as html :refer-macros [html]]
-            [rum.core :as rum]
+  (:require [potok.core :as ptk]
             [lentes.core :as l]
-            [uxbox.util.i18n :refer (tr)]
+            [uxbox.util.i18n :refer [tr]]
             [uxbox.util.router :as r]
-            [potok.core :as ptk]
             [uxbox.main.store :as st]
             [uxbox.main.data.projects :as dp]
             [uxbox.main.ui.navigation :as nav]
             [uxbox.builtins.icons :as i]
-            [uxbox.main.ui.users :refer (user)]
-            [uxbox.util.mixins :as mx :include-macros true]))
+            [uxbox.main.ui.users :refer [user]]
+            [rumext.core :as mx :include-macros true]))
 
 (def ^:private section-ref
   (-> (l/in [:route :id])
       (l/derive st/state)))
 
-(defn- header-link
+(mx/defc header-link
   [section content]
   (let [link (r/route-for section)]
-    (html
-     [:a {:href (str "/#" link)} content])))
+    [:a {:href (str "/#" link)} content]))
 
-(defn header-render
-  [own]
+(mx/defc header
+  {:mixins [mx/static mx/reactive]}
+  []
   (let [section (mx/react section-ref)
         profile? (= section :settings/profile)
         password? (= section :settings/password)
         notifications? (= section :settings/notifications)]
-    (html
-     [:header#main-bar.main-bar
-      [:div.main-logo
-       (header-link :dashboard/projects i/logo)]
-      [:ul.main-nav
-       [:li {:class (when profile? "current")}
-        (header-link :settings/profile (tr "settings.profile"))]
-       [:li {:class (when password? "current")}
-        (header-link :settings/password (tr "settings.password"))]
-       [:li {:class (when notifications? "current")}
-        (header-link :settings/notifications (tr "settings.notifications"))]]
-      (user)])))
+    [:header#main-bar.main-bar
+     [:div.main-logo
+      (header-link :dashboard/projects i/logo)]
+     [:ul.main-nav
+      [:li {:class (when profile? "current")}
+       (header-link :settings/profile (tr "settings.profile"))]
+      [:li {:class (when password? "current")}
+       (header-link :settings/password (tr "settings.password"))]
+      [:li {:class (when notifications? "current")}
+       (header-link :settings/notifications (tr "settings.notifications"))]]
+     (user)]))
 
-(def header
-  (mx/component
-   {:render header-render
-    :name "header"
-    :mixins [rum/static
-             mx/reactive]}))
diff --git a/frontend/src/uxbox/main/ui/settings/notifications.cljs b/frontend/src/uxbox/main/ui/settings/notifications.cljs
index 6a740c11f..287c0a2f6 100644
--- a/frontend/src/uxbox/main/ui/settings/notifications.cljs
+++ b/frontend/src/uxbox/main/ui/settings/notifications.cljs
@@ -12,31 +12,36 @@
             [uxbox.util.router :as r]
             [potok.core :as ptk]
             [uxbox.builtins.icons :as i]
-            [uxbox.util.mixins :as mx :include-macros true]
+            [rumext.core :as mx :include-macros true]
             [uxbox.util.dom :as dom]
             [uxbox.main.ui.settings.header :refer (header)]))
 
-(defn notifications-page-render
+(mx/defc notifications-page
+  {:mixins [mx/static]}
   [own]
-  (html
-   [:main.dashboard-main
-    (header)
-    [:section.dashboard-content.user-settings
-     [:section.user-settings-content
-      [:span.user-settings-label "Prototype notifications"]
-      [:p "Get a roll up of prototype changes in your inbox."]
+  [:main.dashboard-main
+   (header)
+   [:section.dashboard-content.user-settings
+    [:section.user-settings-content
+     [:span.user-settings-label "Prototype notifications"]
+     [:p "Get a roll up of prototype changes in your inbox."]
      [:div.input-radio.radio-primary
-      [:input {:type "radio" :id "notification-1" :name "notification-1" :value "none"}]
-      [:label {:for "notification-1" :value "None"} "None"]
-      [:input {:type "radio" :id "notification-2" :name "notification-2" :value "every-hour"}]
-      [:label {:for "notification-2" :value "Every hour"} "Every hour"]
-      [:input {:type "radio" :id "notification-3" :name "notification-3" :value "every-day"}]
+      [:input {:type "radio"
+               :id "notification-1"
+               :name "notification-1"
+               :value "none"}]
+      [:label {:for "notification-1"
+               :value "None"} "None"]
+      [:input {:type "radio"
+               :id "notification-2"
+               :name "notification-2"
+               :value "every-hour"}]
+      [:label {:for "notification-2"
+               :value "Every hour"} "Every hour"]
+      [:input {:type "radio"
+               :id "notification-3"
+               :name "notification-3"
+               :value "every-day"}]
       [:label {:for "notification-3" :value "Every day"} "Every day"]]
      [:input.btn-primary {:type "submit" :value "Update settings"}]
-     ]]]))
-
-(def notifications-page
-  (mx/component
-   {:render notifications-page-render
-    :name "notifications-page"
-    :mixins [mx/static]}))
+     ]]])
diff --git a/frontend/src/uxbox/main/ui/settings/password.cljs b/frontend/src/uxbox/main/ui/settings/password.cljs
index 1b631a556..6006a37c1 100644
--- a/frontend/src/uxbox/main/ui/settings/password.cljs
+++ b/frontend/src/uxbox/main/ui/settings/password.cljs
@@ -19,7 +19,7 @@
             [uxbox.util.forms :as fm]
             [uxbox.util.dom :as dom]
             [uxbox.util.messages :as um]
-            [uxbox.util.mixins :as mx :include-macros true]))
+            [rumext.core :as mx :include-macros true]))
 
 (def form-data (fm/focus-data :profile-password st/state))
 (def form-errors (fm/focus-errors :profile-password st/state))
diff --git a/frontend/src/uxbox/main/ui/settings/profile.cljs b/frontend/src/uxbox/main/ui/settings/profile.cljs
index f228dc8bd..d320d376e 100644
--- a/frontend/src/uxbox/main/ui/settings/profile.cljs
+++ b/frontend/src/uxbox/main/ui/settings/profile.cljs
@@ -17,7 +17,7 @@
             [uxbox.main.data.users :as udu]
             [uxbox.util.forms :as fm]
             [uxbox.util.router :as r]
-            [uxbox.util.mixins :as mx :include-macros true]
+            [rumext.core :as mx :include-macros true]
             [uxbox.util.interop :refer [iterable->seq]]
             [uxbox.util.dom :as dom]))
 
diff --git a/frontend/src/uxbox/main/ui/shapes/circle.cljs b/frontend/src/uxbox/main/ui/shapes/circle.cljs
index af10bb479..825216b4f 100644
--- a/frontend/src/uxbox/main/ui/shapes/circle.cljs
+++ b/frontend/src/uxbox/main/ui/shapes/circle.cljs
@@ -13,7 +13,7 @@
             [uxbox.util.data :refer [classnames]]
             [uxbox.util.geom.matrix :as gmt]
             [uxbox.util.geom.point :as gpt]
-            [uxbox.util.mixins :as mx :include-macros true]))
+            [rumext.core :as mx :include-macros true]))
 
 ;; --- Circle Component
 
diff --git a/frontend/src/uxbox/main/ui/shapes/group.cljs b/frontend/src/uxbox/main/ui/shapes/group.cljs
index 546eadcfa..c30349719 100644
--- a/frontend/src/uxbox/main/ui/shapes/group.cljs
+++ b/frontend/src/uxbox/main/ui/shapes/group.cljs
@@ -19,7 +19,7 @@
             [uxbox.main.ui.shapes.image :as image]
             [uxbox.util.data :refer [classnames]]
             [uxbox.util.geom.matrix :as gmt]
-            [uxbox.util.mixins :as mx :include-macros true]))
+            [rumext.core :as mx :include-macros true]))
 
 ;; --- Helpers
 
diff --git a/frontend/src/uxbox/main/ui/shapes/icon.cljs b/frontend/src/uxbox/main/ui/shapes/icon.cljs
index a33b16724..d04f4e452 100644
--- a/frontend/src/uxbox/main/ui/shapes/icon.cljs
+++ b/frontend/src/uxbox/main/ui/shapes/icon.cljs
@@ -12,7 +12,7 @@
             [uxbox.util.data :refer [classnames]]
             [uxbox.util.geom.matrix :as gmt]
             [uxbox.util.geom.point :as gpt]
-            [uxbox.util.mixins :as mx :include-macros true]))
+            [rumext.core :as mx :include-macros true]))
 
 
 ;; --- Icon Component
diff --git a/frontend/src/uxbox/main/ui/shapes/image.cljs b/frontend/src/uxbox/main/ui/shapes/image.cljs
index 0252d6b58..566fdd3a3 100644
--- a/frontend/src/uxbox/main/ui/shapes/image.cljs
+++ b/frontend/src/uxbox/main/ui/shapes/image.cljs
@@ -16,7 +16,7 @@
             [uxbox.main.data.images :as udi]
             [uxbox.util.data :refer [classnames]]
             [uxbox.util.geom.matrix :as gmt]
-            [uxbox.util.mixins :as mx :include-macros true]))
+            [rumext.core :as mx :include-macros true]))
 
 ;; --- Refs
 
diff --git a/frontend/src/uxbox/main/ui/shapes/path.cljs b/frontend/src/uxbox/main/ui/shapes/path.cljs
index 6d40929ec..3972cfdc2 100644
--- a/frontend/src/uxbox/main/ui/shapes/path.cljs
+++ b/frontend/src/uxbox/main/ui/shapes/path.cljs
@@ -16,7 +16,7 @@
             [uxbox.util.data :refer [classnames]]
             [uxbox.util.geom.matrix :as gmt]
             [uxbox.util.geom.point :as gpt]
-            [uxbox.util.mixins :as mx :include-macros true]))
+            [rumext.core :as mx :include-macros true]))
 ;; --- Path Component
 
 (declare path-shape)
diff --git a/frontend/src/uxbox/main/ui/shapes/rect.cljs b/frontend/src/uxbox/main/ui/shapes/rect.cljs
index dfe56ce55..bd979fbcd 100644
--- a/frontend/src/uxbox/main/ui/shapes/rect.cljs
+++ b/frontend/src/uxbox/main/ui/shapes/rect.cljs
@@ -11,7 +11,7 @@
             [uxbox.main.ui.shapes.attrs :as attrs]
             [uxbox.util.geom.matrix :as gmt]
             [uxbox.util.geom.point :as gpt]
-            [uxbox.util.mixins :as mx :include-macros true]
+            [rumext.core :as mx :include-macros true]
             [uxbox.util.data :refer [classnames]]
             [uxbox.util.dom :as dom]))
 
diff --git a/frontend/src/uxbox/main/ui/shapes/selection.cljs b/frontend/src/uxbox/main/ui/shapes/selection.cljs
index 9872b9d4b..068c04530 100644
--- a/frontend/src/uxbox/main/ui/shapes/selection.cljs
+++ b/frontend/src/uxbox/main/ui/shapes/selection.cljs
@@ -19,7 +19,7 @@
             [uxbox.main.data.shapes :as uds]
             [uxbox.main.ui.shapes.common :as scommon]
             [uxbox.main.geom :as geom]
-            [uxbox.util.mixins :as mx :include-macros true]
+            [rumext.core :as mx :include-macros true]
             [uxbox.util.geom.matrix :as gmt]
             [uxbox.util.geom.point :as gpt]
             [uxbox.util.dom :as dom]))
diff --git a/frontend/src/uxbox/main/ui/shapes/text.cljs b/frontend/src/uxbox/main/ui/shapes/text.cljs
index ca1c4e2c3..3708c88c3 100644
--- a/frontend/src/uxbox/main/ui/shapes/text.cljs
+++ b/frontend/src/uxbox/main/ui/shapes/text.cljs
@@ -19,7 +19,7 @@
             [uxbox.util.data :refer [classnames]]
             [uxbox.util.dom :as dom]
             [uxbox.util.geom.matrix :as gmt]
-            [uxbox.util.mixins :as mx :include-macros true])
+            [rumext.core :as mx :include-macros true])
   (:import goog.events.EventType))
 
 ;; --- Events
diff --git a/frontend/src/uxbox/main/ui/users.cljs b/frontend/src/uxbox/main/ui/users.cljs
index 1fcf3f1d9..14af87779 100644
--- a/frontend/src/uxbox/main/ui/users.cljs
+++ b/frontend/src/uxbox/main/ui/users.cljs
@@ -14,7 +14,7 @@
             [uxbox.builtins.icons :as i]
             [uxbox.main.ui.navigation :as nav]
             [uxbox.util.router :as rt]
-            [uxbox.util.mixins :as mx :include-macros true]))
+            [rumext.core :as mx :include-macros true]))
 
 ;; --- User Menu
 
diff --git a/frontend/src/uxbox/main/ui/workspace.cljs b/frontend/src/uxbox/main/ui/workspace.cljs
index c68f5239c..485b43a36 100644
--- a/frontend/src/uxbox/main/ui/workspace.cljs
+++ b/frontend/src/uxbox/main/ui/workspace.cljs
@@ -33,7 +33,7 @@
             [uxbox.util.dom :as dom]
             [uxbox.util.geom.point :as gpt]
             [uxbox.util.data :refer [classnames]]
-            [uxbox.util.mixins :as mx :include-macros true]))
+            [rumext.core :as mx :include-macros true]))
 
 ;; --- Workspace
 
diff --git a/frontend/src/uxbox/main/ui/workspace/canvas.cljs b/frontend/src/uxbox/main/ui/workspace/canvas.cljs
index 4bf63f0a3..cdf812e42 100644
--- a/frontend/src/uxbox/main/ui/workspace/canvas.cljs
+++ b/frontend/src/uxbox/main/ui/workspace/canvas.cljs
@@ -29,7 +29,7 @@
             [uxbox.util.geom.point :as gpt]
             [uxbox.util.dom :as dom]
             [uxbox.util.data :refer [parse-int]]
-            [uxbox.util.mixins :as mx :include-macros true])
+            [rumext.core :as mx :include-macros true])
   (:import goog.events.EventType))
 
 ;; --- Background
diff --git a/frontend/src/uxbox/main/ui/workspace/clipboard.cljs b/frontend/src/uxbox/main/ui/workspace/clipboard.cljs
index 38cb31d62..24b29139b 100644
--- a/frontend/src/uxbox/main/ui/workspace/clipboard.cljs
+++ b/frontend/src/uxbox/main/ui/workspace/clipboard.cljs
@@ -7,13 +7,14 @@
 
 (ns uxbox.main.ui.workspace.clipboard
   (:require [lentes.core :as l]
+            [sablono.core :refer-macros [html]]
             [uxbox.main.store :as st]
             [uxbox.main.data.lightbox :as udl]
             [uxbox.main.data.workspace :as udw]
             [uxbox.builtins.icons :as i]
             [uxbox.main.ui.lightbox :as lbx]
             [potok.core :as ptk]
-            [uxbox.util.mixins :as mx :include-macros true]
+            [rumext.core :as mx :include-macros true]
             [uxbox.util.dom :as dom]
             [uxbox.util.time :as dt]))
 
@@ -30,15 +31,13 @@
           (on-close [event]
             (dom/prevent-default event)
             (udl/close!))]
-    [:div.lightbox-body.clipboard
-     [:div.clipboard-list
-      (for [item (mx/react clipboard-ref)]
-        [:div.clipboard-item
-         {:key (str (:id item))
-          :on-click (partial on-paste item)}
-         [:span.clipboard-icon i/box]
-         [:span (str "Copied (" (dt/timeago (:created-at item)) ")")]])]
-     [:a.close {:href "#" :on-click on-close} i/close]]))
+    [:div.lightbox-body.clipboard {}
+     [:div.clipboard-list {}
+      (mx/doseq [item (mx/react clipboard-ref)]
+        [:div.clipboard-item {:key (str (:id item))}
+         [:span.clipboard-icon {} ^:inline i/box]
+         [:span {} ^String (str "Copied (" (dt/timeago (:created-at item)) ")")]])]
+     [:a.close {:href "#"} ^:inline i/close]]))
 
 (defmethod lbx/render-lightbox :clipboard
   [_]
diff --git a/frontend/src/uxbox/main/ui/workspace/colorpalette.cljs b/frontend/src/uxbox/main/ui/workspace/colorpalette.cljs
index 16dd6b623..7fea655ca 100644
--- a/frontend/src/uxbox/main/ui/workspace/colorpalette.cljs
+++ b/frontend/src/uxbox/main/ui/workspace/colorpalette.cljs
@@ -21,7 +21,7 @@
             [uxbox.util.data :refer (read-string)]
             [uxbox.util.color :refer (hex->rgb)]
             [uxbox.util.dom :as dom]
-            [uxbox.util.mixins :as mx :include-macros true]))
+            [rumext.core :as mx :include-macros true]))
 
 (defn- get-selected-collection
   [local collections]
diff --git a/frontend/src/uxbox/main/ui/workspace/colorpicker.cljs b/frontend/src/uxbox/main/ui/workspace/colorpicker.cljs
index 7f7971a78..e26adb318 100644
--- a/frontend/src/uxbox/main/ui/workspace/colorpicker.cljs
+++ b/frontend/src/uxbox/main/ui/workspace/colorpicker.cljs
@@ -19,7 +19,7 @@
             [uxbox.main.ui.colorpicker :as cp]
             [uxbox.main.ui.workspace.recent-colors :refer [recent-colors]]
             [uxbox.util.router :as rt]
-            [uxbox.util.mixins :as mx :include-macros true]
+            [rumext.core :as mx :include-macros true]
             [uxbox.util.dom :as dom]
             [uxbox.util.data :refer [parse-int parse-float read-string]]))
 
diff --git a/frontend/src/uxbox/main/ui/workspace/download.cljs b/frontend/src/uxbox/main/ui/workspace/download.cljs
index fed389c1a..23fb5acc3 100644
--- a/frontend/src/uxbox/main/ui/workspace/download.cljs
+++ b/frontend/src/uxbox/main/ui/workspace/download.cljs
@@ -20,7 +20,7 @@
             [uxbox.util.data :refer (read-string)]
             [uxbox.util.time :as dt]
             [uxbox.util.dom :as dom]
-            [uxbox.util.mixins :as mx :include-macros true]
+            [rumext.core :as mx :include-macros true]
             [uxbox.util.zip :as zip]))
 
 ;; --- Refs
diff --git a/frontend/src/uxbox/main/ui/workspace/drawarea.cljs b/frontend/src/uxbox/main/ui/workspace/drawarea.cljs
index 2ceb37d34..eae72e982 100644
--- a/frontend/src/uxbox/main/ui/workspace/drawarea.cljs
+++ b/frontend/src/uxbox/main/ui/workspace/drawarea.cljs
@@ -9,7 +9,7 @@
   (:require [beicon.core :as rx]
             [potok.core :as ptk]
             [lentes.core :as l]
-            [uxbox.util.mixins :as mx :include-macros true]
+            [rumext.core :as mx :include-macros true]
             [uxbox.main.store :as st]
             [uxbox.main.constants :as c]
             [uxbox.main.refs :as refs]
diff --git a/frontend/src/uxbox/main/ui/workspace/grid.cljs b/frontend/src/uxbox/main/ui/workspace/grid.cljs
index 7d8a9f3ec..4eb9d97e9 100644
--- a/frontend/src/uxbox/main/ui/workspace/grid.cljs
+++ b/frontend/src/uxbox/main/ui/workspace/grid.cljs
@@ -9,7 +9,7 @@
   (:require [cuerdas.core :as str]
             [uxbox.main.constants :as c]
             [uxbox.main.refs :as refs]
-            [uxbox.util.mixins :as mx :include-macros true]))
+            [rumext.core :as mx :include-macros true]))
 
 ;; --- Grid (Component)
 
diff --git a/frontend/src/uxbox/main/ui/workspace/header.cljs b/frontend/src/uxbox/main/ui/workspace/header.cljs
index 91df98ad5..194ab7527 100644
--- a/frontend/src/uxbox/main/ui/workspace/header.cljs
+++ b/frontend/src/uxbox/main/ui/workspace/header.cljs
@@ -24,7 +24,7 @@
             [uxbox.util.data :refer [index-of]]
             [uxbox.util.geom.point :as gpt]
             [uxbox.util.math :as mth]
-            [uxbox.util.mixins :as mx :include-macros true]))
+            [rumext.core :as mx :include-macros true]))
 
 ;; --- Zoom Widget
 
diff --git a/frontend/src/uxbox/main/ui/workspace/images.cljs b/frontend/src/uxbox/main/ui/workspace/images.cljs
index f311e0576..d98a57d84 100644
--- a/frontend/src/uxbox/main/ui/workspace/images.cljs
+++ b/frontend/src/uxbox/main/ui/workspace/images.cljs
@@ -18,7 +18,7 @@
             [uxbox.main.ui.lightbox :as lbx]
             [uxbox.util.data :refer [read-string jscoll->vec]]
             [uxbox.util.dom :as dom]
-            [uxbox.util.mixins :as mx :include-macros true]
+            [rumext.core :as mx :include-macros true]
             [uxbox.util.uuid :as uuid]))
 
 ;; --- Refs
diff --git a/frontend/src/uxbox/main/ui/workspace/recent_colors.cljs b/frontend/src/uxbox/main/ui/workspace/recent_colors.cljs
index 10f3e86af..0b6e66a41 100644
--- a/frontend/src/uxbox/main/ui/workspace/recent_colors.cljs
+++ b/frontend/src/uxbox/main/ui/workspace/recent_colors.cljs
@@ -12,7 +12,7 @@
             [uxbox.main.refs :as refs]
             [uxbox.main.data.workspace :as dw]
             [uxbox.builtins.icons :as i]
-            [uxbox.util.mixins :as mx :include-macros true]
+            [rumext.core :as mx :include-macros true]
             [uxbox.util.dom :as dom]
             [uxbox.util.i18n :refer (tr)]))
 
diff --git a/frontend/src/uxbox/main/ui/workspace/ruler.cljs b/frontend/src/uxbox/main/ui/workspace/ruler.cljs
index 12e4c6591..8254fd4a1 100644
--- a/frontend/src/uxbox/main/ui/workspace/ruler.cljs
+++ b/frontend/src/uxbox/main/ui/workspace/ruler.cljs
@@ -16,7 +16,7 @@
             [uxbox.main.store :as st]
             [uxbox.main.user-events :as uev]
             [uxbox.util.math :as mth]
-            [uxbox.util.mixins :as mx :include-macros true]
+            [rumext.core :as mx :include-macros true]
             [uxbox.util.geom.point :as gpt]
             [uxbox.util.dom :as dom]))
 
diff --git a/frontend/src/uxbox/main/ui/workspace/rules.cljs b/frontend/src/uxbox/main/ui/workspace/rules.cljs
index c56259a26..7c097df2e 100644
--- a/frontend/src/uxbox/main/ui/workspace/rules.cljs
+++ b/frontend/src/uxbox/main/ui/workspace/rules.cljs
@@ -13,7 +13,7 @@
             [uxbox.main.constants :as c]
             [uxbox.main.refs :as refs]
             [uxbox.util.dom :as dom]
-            [uxbox.util.mixins :as mx :include-macros true]))
+            [rumext.core :as mx :include-macros true]))
 
 ;; --- Constants & Helpers
 
diff --git a/frontend/src/uxbox/main/ui/workspace/scroll.cljs b/frontend/src/uxbox/main/ui/workspace/scroll.cljs
index d1378becb..ff81b76ab 100644
--- a/frontend/src/uxbox/main/ui/workspace/scroll.cljs
+++ b/frontend/src/uxbox/main/ui/workspace/scroll.cljs
@@ -10,7 +10,7 @@
   (:require [beicon.core :as rx]
             [potok.core :as ptk]
             [uxbox.main.refs :as refs]
-            [uxbox.util.mixins :as mx :include-macros true]
+            [rumext.core :as mx :include-macros true]
             [uxbox.util.dom :as dom]
             [uxbox.util.geom.point :as gpt]))
 
diff --git a/frontend/src/uxbox/main/ui/workspace/sidebar.cljs b/frontend/src/uxbox/main/ui/workspace/sidebar.cljs
index eb8dc83d6..160bc1b59 100644
--- a/frontend/src/uxbox/main/ui/workspace/sidebar.cljs
+++ b/frontend/src/uxbox/main/ui/workspace/sidebar.cljs
@@ -13,7 +13,7 @@
             [uxbox.main.ui.workspace.sidebar.history :refer [history-toolbox]]
             [uxbox.main.ui.workspace.sidebar.icons :refer [icons-toolbox]]
             [uxbox.main.ui.workspace.sidebar.drawtools :refer [draw-toolbox]]
-            [uxbox.util.mixins :as mx :include-macros true]))
+            [rumext.core :as mx :include-macros true]))
 
 ;; --- Left Sidebar (Component)
 
diff --git a/frontend/src/uxbox/main/ui/workspace/sidebar/drawtools.cljs b/frontend/src/uxbox/main/ui/workspace/sidebar/drawtools.cljs
index 507081fe7..f319816db 100644
--- a/frontend/src/uxbox/main/ui/workspace/sidebar/drawtools.cljs
+++ b/frontend/src/uxbox/main/ui/workspace/sidebar/drawtools.cljs
@@ -19,7 +19,7 @@
             [uxbox.util.i18n :refer (tr)]
             [uxbox.util.router :as r]
             [uxbox.util.data :refer (read-string)]
-            [uxbox.util.mixins :as mx :include-macros true]
+            [rumext.core :as mx :include-macros true]
             [uxbox.util.dom :as dom]))
 
 ;; --- Refs
diff --git a/frontend/src/uxbox/main/ui/workspace/sidebar/history.cljs b/frontend/src/uxbox/main/ui/workspace/sidebar/history.cljs
index 1d6721391..6277f35f3 100644
--- a/frontend/src/uxbox/main/ui/workspace/sidebar/history.cljs
+++ b/frontend/src/uxbox/main/ui/workspace/sidebar/history.cljs
@@ -15,7 +15,7 @@
             [uxbox.util.data :refer [read-string]]
             [uxbox.util.dom :as dom]
             [uxbox.util.i18n :refer [tr]]
-            [uxbox.util.mixins :as mx :include-macros true]
+            [rumext.core :as mx :include-macros true]
             [uxbox.util.router :as r]
             [uxbox.util.time :as dt]))
 
diff --git a/frontend/src/uxbox/main/ui/workspace/sidebar/icons.cljs b/frontend/src/uxbox/main/ui/workspace/sidebar/icons.cljs
index 8c66a4071..cfd097700 100644
--- a/frontend/src/uxbox/main/ui/workspace/sidebar/icons.cljs
+++ b/frontend/src/uxbox/main/ui/workspace/sidebar/icons.cljs
@@ -16,7 +16,7 @@
             [uxbox.main.ui.shapes.icon :as icon]
             [uxbox.main.ui.dashboard.icons :as icons]
             [uxbox.builtins.icons :as i]
-            [uxbox.util.mixins :as mx :include-macros true]
+            [rumext.core :as mx :include-macros true]
             [uxbox.util.dom :as dom]
             [uxbox.util.data :refer (read-string)]))
 
diff --git a/frontend/src/uxbox/main/ui/workspace/sidebar/layers.cljs b/frontend/src/uxbox/main/ui/workspace/sidebar/layers.cljs
index fc774dfcd..613e82864 100644
--- a/frontend/src/uxbox/main/ui/workspace/sidebar/layers.cljs
+++ b/frontend/src/uxbox/main/ui/workspace/sidebar/layers.cljs
@@ -19,7 +19,7 @@
             [uxbox.main.ui.keyboard :as kbd]
             [uxbox.util.data :refer (read-string classnames)]
             [uxbox.util.router :as r]
-            [uxbox.util.mixins :as mx :include-macros true]
+            [rumext.core :as mx :include-macros true]
             [uxbox.util.dom.dnd :as dnd]
             [uxbox.util.dom :as dom])
   (:import goog.events.EventType))
diff --git a/frontend/src/uxbox/main/ui/workspace/sidebar/options.cljs b/frontend/src/uxbox/main/ui/workspace/sidebar/options.cljs
index 58593af32..8c170ad89 100644
--- a/frontend/src/uxbox/main/ui/workspace/sidebar/options.cljs
+++ b/frontend/src/uxbox/main/ui/workspace/sidebar/options.cljs
@@ -28,7 +28,7 @@
    [uxbox.main.geom :as geom]
    [uxbox.util.dom :as dom]
    [uxbox.util.data :as data]
-   [uxbox.util.mixins :as mx :include-macros true]))
+   [rumext.core :as mx :include-macros true]))
 
 ;; --- Constants
 
diff --git a/frontend/src/uxbox/main/ui/workspace/sidebar/options/circle_measures.cljs b/frontend/src/uxbox/main/ui/workspace/sidebar/options/circle_measures.cljs
index aa802f464..a5e793a8d 100644
--- a/frontend/src/uxbox/main/ui/workspace/sidebar/options/circle_measures.cljs
+++ b/frontend/src/uxbox/main/ui/workspace/sidebar/options/circle_measures.cljs
@@ -16,7 +16,7 @@
             [uxbox.main.data.workspace :as udw]
             [uxbox.main.data.shapes :as uds]
             [uxbox.builtins.icons :as i]
-            [uxbox.util.mixins :as mx :include-macros true]
+            [rumext.core :as mx :include-macros true]
             [uxbox.main.geom :as geom]
             [uxbox.util.dom :as dom]
             [uxbox.util.geom.point :as gpt]
diff --git a/frontend/src/uxbox/main/ui/workspace/sidebar/options/fill.cljs b/frontend/src/uxbox/main/ui/workspace/sidebar/options/fill.cljs
index 3e3b512cb..20976757d 100644
--- a/frontend/src/uxbox/main/ui/workspace/sidebar/options/fill.cljs
+++ b/frontend/src/uxbox/main/ui/workspace/sidebar/options/fill.cljs
@@ -14,7 +14,7 @@
             [uxbox.main.data.shapes :as uds]
             [uxbox.main.data.lightbox :as udl]
             [uxbox.builtins.icons :as i]
-            [uxbox.util.mixins :as mx :include-macros true]
+            [rumext.core :as mx :include-macros true]
             [uxbox.util.dom :as dom]
             [uxbox.util.data :refer (parse-int parse-float read-string)]
             [uxbox.util.spec :refer (color?)]))
diff --git a/frontend/src/uxbox/main/ui/workspace/sidebar/options/icon_measures.cljs b/frontend/src/uxbox/main/ui/workspace/sidebar/options/icon_measures.cljs
index 5635f2b88..e89da9912 100644
--- a/frontend/src/uxbox/main/ui/workspace/sidebar/options/icon_measures.cljs
+++ b/frontend/src/uxbox/main/ui/workspace/sidebar/options/icon_measures.cljs
@@ -6,25 +6,24 @@
 ;; Copyright (c) 2015-2016 Juan de la Cruz <delacruzgarciajuan@gmail.com>
 
 (ns uxbox.main.ui.workspace.sidebar.options.icon-measures
-  (:require [sablono.core :as html :refer-macros [html]]
-            [rum.core :as rum]
-            [lentes.core :as l]
-            [uxbox.util.i18n :refer (tr)]
-            [uxbox.util.router :as r]
+  (:require [lentes.core :as l]
             [potok.core :as ptk]
+            [uxbox.builtins.icons :as i]
+            [uxbox.util.i18n :refer [tr]]
+            [uxbox.util.router :as r]
             [uxbox.main.store :as st]
             [uxbox.main.data.workspace :as udw]
             [uxbox.main.data.shapes :as uds]
-            [uxbox.builtins.icons :as i]
-            [uxbox.util.mixins :as mx :include-macros true]
             [uxbox.main.geom :as geom]
+            [rumext.core :as mx :include-macros true]
             [uxbox.util.dom :as dom]
             [uxbox.util.geom.point :as gpt]
-            [uxbox.util.data :refer (parse-int parse-float read-string)]
-            [uxbox.util.math :refer (precision-or-0)]))
+            [uxbox.util.data :refer [parse-int parse-float read-string]]
+            [uxbox.util.math :refer [precision-or-0]]))
 
-(defn- icon-measures-menu-render
-  [own menu shape]
+(mx/defc icon-measures-menu
+  {:mixins [mx/static]}
+  [menu shape]
   (letfn [(on-size-change [attr event]
             (let [value (dom/event->value event)
                   value (parse-int value 0)
@@ -47,72 +46,65 @@
               (st/emit! (uds/unlock-proportions (:id shape)))
               (st/emit! (uds/lock-proportions (:id shape)))))]
     (let [size (geom/size shape)]
-      (html
-       [:div.element-set {:key (str (:id menu))}
-        [:div.element-set-title (:name menu)]
-        [:div.element-set-content
-         ;; SLIDEBAR FOR ROTATION AND OPACITY
-         [:span "Size"]
-         [:div.row-flex
-          [:div.input-element.pixels
-           [:input.input-text
-            {:placeholder "Width"
-             :type "number"
-             :min "0"
-             :value (precision-or-0 (:width size) 2)
-             :on-change (partial on-size-change :width)}]]
-          [:div.lock-size
-           {:class (when (:proportion-lock shape) "selected")
-            :on-click on-proportion-lock-change}
-           (if (:proportion-lock shape) i/lock i/unlock)]
-          [:div.input-element.pixels
-           [:input.input-text
-            {:placeholder "Height"
-             :type "number"
-             :min "0"
-             :value (precision-or-0 (:height size) 2)
-             :on-change (partial on-size-change :height)}]]]
+      [:div.element-set {:key (str (:id menu))}
+       [:div.element-set-title (:name menu)]
+       [:div.element-set-content
+        ;; SLIDEBAR FOR ROTATION AND OPACITY
+        [:span "Size"]
+        [:div.row-flex
+         [:div.input-element.pixels
+          [:input.input-text
+           {:placeholder "Width"
+            :type "number"
+            :min "0"
+            :value (precision-or-0 (:width size) 2)
+            :on-change (partial on-size-change :width)}]]
+         [:div.lock-size
+          {:class (when (:proportion-lock shape) "selected")
+           :on-click on-proportion-lock-change}
+          (if (:proportion-lock shape) i/lock i/unlock)]
+         [:div.input-element.pixels
+          [:input.input-text
+           {:placeholder "Height"
+            :type "number"
+            :min "0"
+            :value (precision-or-0 (:height size) 2)
+            :on-change (partial on-size-change :height)}]]]
 
-         [:span "Position"]
-         [:div.row-flex
-          [:div.input-element.pixels
-           [:input.input-text
-            {:placeholder "X"
-             :type "number"
-             :value (precision-or-0 (:x1 shape 0) 2)
-             :on-change (partial on-pos-change :x)}]]
-          [:div.input-element.pixels
-           [:input.input-text
-            {:placeholder "Y"
-             :type "number"
-             :value (precision-or-0 (:y1 shape 0) 2)
-             :on-change (partial on-pos-change :y)}]]]
+        [:span "Position"]
+        [:div.row-flex
+         [:div.input-element.pixels
+          [:input.input-text
+           {:placeholder "X"
+            :type "number"
+            :value (precision-or-0 (:x1 shape 0) 2)
+            :on-change (partial on-pos-change :x)}]]
+         [:div.input-element.pixels
+          [:input.input-text
+           {:placeholder "Y"
+            :type "number"
+            :value (precision-or-0 (:y1 shape 0) 2)
+            :on-change (partial on-pos-change :y)}]]]
 
-         [:span "Rotation"]
-         [:div.row-flex
-          [:input.slidebar
-           {:type "range"
+        [:span "Rotation"]
+        [:div.row-flex
+         [:input.slidebar
+          {:type "range"
+           :min 0
+           :max 360
+           :value (:rotation shape 0)
+           :on-change on-rotation-change}]]
+
+        [:div.row-flex
+         [:div.input-element.degrees
+          [:input.input-text
+           {:placeholder ""
+            :type "number"
             :min 0
             :max 360
-            :value (:rotation shape 0)
-            :on-change on-rotation-change}]]
-
-         [:div.row-flex
-          [:div.input-element.degrees
-           [:input.input-text
-            {:placeholder ""
-             :type "number"
-             :min 0
-             :max 360
-             :value (precision-or-0 (:rotation shape 0) 2)
-             :on-change on-rotation-change
+            :value (precision-or-0 (:rotation shape 0) 2)
+            :on-change on-rotation-change
             }]]
-          [:input.input-text
-           {:style {:visibility "hidden"}}]
-          ]]]))))
-
-(def icon-measures-menu
-  (mx/component
-   {:render icon-measures-menu-render
-    :name "icon-measures-menu"
-    :mixins [mx/static]}))
+         [:input.input-text
+          {:style {:visibility "hidden"}}]
+         ]]])))
diff --git a/frontend/src/uxbox/main/ui/workspace/sidebar/options/image_measures.cljs b/frontend/src/uxbox/main/ui/workspace/sidebar/options/image_measures.cljs
index a19de6c72..72905b8f7 100644
--- a/frontend/src/uxbox/main/ui/workspace/sidebar/options/image_measures.cljs
+++ b/frontend/src/uxbox/main/ui/workspace/sidebar/options/image_measures.cljs
@@ -19,7 +19,7 @@
             [uxbox.util.geom.point :as gpt]
             [uxbox.util.data :refer (parse-int parse-float read-string)]
             [uxbox.util.math :refer (precision-or-0)]
-            [uxbox.util.mixins :as mx :include-macros true]))
+            [rumext.core :as mx :include-macros true]))
 
 (mx/defc image-measures-menu
   {:mixins [mx/static]}
diff --git a/frontend/src/uxbox/main/ui/workspace/sidebar/options/interactions.cljs b/frontend/src/uxbox/main/ui/workspace/sidebar/options/interactions.cljs
index f24879797..7a5457813 100644
--- a/frontend/src/uxbox/main/ui/workspace/sidebar/options/interactions.cljs
+++ b/frontend/src/uxbox/main/ui/workspace/sidebar/options/interactions.cljs
@@ -19,7 +19,7 @@
             [uxbox.util.dom :as dom]
             [uxbox.util.data :refer [read-string]]
             [uxbox.util.spec :refer [color?]]
-            [uxbox.util.mixins :as mx :include-macros true]))
+            [rumext.core :as mx :include-macros true]))
 
 ;; --- Helpers
 
@@ -442,9 +442,8 @@
      (when (or (not= (:animation form :none) :none)
                (and (only-easing? (:action form))
                     (:element form)))
-       (mx/concat
-        (easing-input form-ref)
-        (duration-input form-ref)))
+       (list (easing-input form-ref)
+             (duration-input form-ref)))
      ]))
 
 ;; --- Form
diff --git a/frontend/src/uxbox/main/ui/workspace/sidebar/options/page.cljs b/frontend/src/uxbox/main/ui/workspace/sidebar/options/page.cljs
index 502f05be1..7fb8096c6 100644
--- a/frontend/src/uxbox/main/ui/workspace/sidebar/options/page.cljs
+++ b/frontend/src/uxbox/main/ui/workspace/sidebar/options/page.cljs
@@ -18,7 +18,7 @@
             [uxbox.main.data.lightbox :as udl]
             [uxbox.builtins.icons :as i]
             [uxbox.main.ui.workspace.colorpicker]
-            [uxbox.util.mixins :as mx :include-macros true]
+            [rumext.core :as mx :include-macros true]
             [uxbox.util.data :refer [parse-int]]
             [uxbox.util.spec :refer [color?]]
             [uxbox.util.dom :as dom]))
diff --git a/frontend/src/uxbox/main/ui/workspace/sidebar/options/rect_measures.cljs b/frontend/src/uxbox/main/ui/workspace/sidebar/options/rect_measures.cljs
index fa3ad027b..893813501 100644
--- a/frontend/src/uxbox/main/ui/workspace/sidebar/options/rect_measures.cljs
+++ b/frontend/src/uxbox/main/ui/workspace/sidebar/options/rect_measures.cljs
@@ -14,7 +14,7 @@
             [uxbox.main.data.workspace :as udw]
             [uxbox.main.data.shapes :as uds]
             [uxbox.builtins.icons :as i]
-            [uxbox.util.mixins :as mx :include-macros true]
+            [rumext.core :as mx :include-macros true]
             [uxbox.main.geom :as geom]
             [uxbox.util.dom :as dom]
             [uxbox.util.geom.point :as gpt]
diff --git a/frontend/src/uxbox/main/ui/workspace/sidebar/options/stroke.cljs b/frontend/src/uxbox/main/ui/workspace/sidebar/options/stroke.cljs
index 7f242b447..4f8ad668d 100644
--- a/frontend/src/uxbox/main/ui/workspace/sidebar/options/stroke.cljs
+++ b/frontend/src/uxbox/main/ui/workspace/sidebar/options/stroke.cljs
@@ -14,7 +14,7 @@
             [uxbox.main.data.shapes :as uds]
             [uxbox.main.data.lightbox :as udl]
             [uxbox.builtins.icons :as i]
-            [uxbox.util.mixins :as mx :include-macros true]
+            [rumext.core :as mx :include-macros true]
             [uxbox.util.dom :as dom]
             [uxbox.util.data :refer (parse-int parse-float read-string)]
             [uxbox.util.math :refer (precision-or-0)]
diff --git a/frontend/src/uxbox/main/ui/workspace/sidebar/options/text.cljs b/frontend/src/uxbox/main/ui/workspace/sidebar/options/text.cljs
index 441514390..4de51bb52 100644
--- a/frontend/src/uxbox/main/ui/workspace/sidebar/options/text.cljs
+++ b/frontend/src/uxbox/main/ui/workspace/sidebar/options/text.cljs
@@ -15,7 +15,7 @@
             [uxbox.builtins.icons :as i]
             [uxbox.util.i18n :refer (tr)]
             [uxbox.util.router :as r]
-            [uxbox.util.mixins :as mx :include-macros true]
+            [rumext.core :as mx :include-macros true]
             [uxbox.util.dom :as dom]
             [uxbox.util.math :refer (precision-or-0)]
             [uxbox.util.data :refer (parse-int
diff --git a/frontend/src/uxbox/main/ui/workspace/sidebar/sitemap.cljs b/frontend/src/uxbox/main/ui/workspace/sidebar/sitemap.cljs
index 79279e073..7099858a8 100644
--- a/frontend/src/uxbox/main/ui/workspace/sidebar/sitemap.cljs
+++ b/frontend/src/uxbox/main/ui/workspace/sidebar/sitemap.cljs
@@ -22,7 +22,7 @@
             [uxbox.util.data :refer [classnames]]
             [uxbox.util.dom.dnd :as dnd]
             [uxbox.util.dom :as dom]
-            [uxbox.util.mixins :as mx :include-macros true]))
+            [rumext.core :as mx :include-macros true]))
 
 (mx/defcs page-item
   {:mixins [(mx/local) mx/static mx/reactive]}
diff --git a/frontend/src/uxbox/main/ui/workspace/sidebar/sitemap_pageform.cljs b/frontend/src/uxbox/main/ui/workspace/sidebar/sitemap_pageform.cljs
index d1c07dfaf..ea7ca563a 100644
--- a/frontend/src/uxbox/main/ui/workspace/sidebar/sitemap_pageform.cljs
+++ b/frontend/src/uxbox/main/ui/workspace/sidebar/sitemap_pageform.cljs
@@ -19,7 +19,7 @@
             [uxbox.util.forms :as fm]
             [uxbox.util.i18n :refer [tr]]
             [uxbox.util.router :as r]
-            [uxbox.util.mixins :as mx :include-macros true]))
+            [rumext.core :as mx :include-macros true]))
 
 
 (def form-data (fm/focus-data :workspace-page-form st/state))
diff --git a/frontend/src/uxbox/util/forms.cljs b/frontend/src/uxbox/util/forms.cljs
index 5c3c91032..d86cd1b46 100644
--- a/frontend/src/uxbox/util/forms.cljs
+++ b/frontend/src/uxbox/util/forms.cljs
@@ -10,7 +10,7 @@
             [lentes.core :as l]
             [beicon.core :as rx]
             [potok.core :as ptk]
-            [uxbox.util.mixins :as mx :include-macros true]
+            [rumext.core :as mx :include-macros true]
             [uxbox.util.i18n :refer [tr]]))
 
 ;; --- Form Validation Api
diff --git a/frontend/src/uxbox/util/messages.cljs b/frontend/src/uxbox/util/messages.cljs
index f149c423c..e31239729 100644
--- a/frontend/src/uxbox/util/messages.cljs
+++ b/frontend/src/uxbox/util/messages.cljs
@@ -12,7 +12,7 @@
             [potok.core :as ptk]
             [uxbox.builtins.icons :as i]
             [uxbox.util.timers :as ts]
-            [uxbox.util.mixins :as mx :include-macros true]
+            [rumext.core :as mx :include-macros true]
             [uxbox.util.data :refer [classnames]]
             [uxbox.util.dom :as dom]))
 
diff --git a/frontend/src/uxbox/util/mixins.clj b/frontend/src/uxbox/util/mixins.clj
deleted file mode 100644
index fd0fd0ad0..000000000
--- a/frontend/src/uxbox/util/mixins.clj
+++ /dev/null
@@ -1,53 +0,0 @@
-;; This Source Code Form is subject to the terms of the Mozilla Public
-;; License, v. 2.0. If a copy of the MPL was not distributed with this
-;; file, You can obtain one at http://mozilla.org/MPL/2.0/.
-;;
-;; Copyright (c) 2016-2017 Andrey Antukh <niwi@niwi.nz>
-
-(ns uxbox.util.mixins
-  (:require [rum.core :as rum]
-            [sablono.compiler :as s]))
-
-(defn- parse-defc
-  [args]
-  (loop [r {}
-         s 0
-         v (first args)
-         n (rest args)]
-    (case s
-      0 (if (symbol? v)
-          (recur (assoc r :name v) (inc s) (first n) (rest n))
-          (throw (ex-info "Invalid" {})))
-      1 (if (string? v)
-          (recur (assoc r :doc v) (inc s) (first n) (rest n))
-          (recur r (inc s) v n))
-      2 (if (map? v)
-          (if-let [mixins (:mixins v)]
-            (let [spec (dissoc v :mixins)
-                  mixins (if (empty? spec)
-                           mixins
-                           (conj mixins spec))]
-              (recur (assoc r :mixins mixins) (inc s) (first n) (rest n)))
-            (recur (assoc r :mixins [v]) (inc s) (first n) (rest n)))
-          (recur r (inc s) v n))
-      3 (if (vector? v)
-          (recur (assoc r :args v) (inc s) (first n) (rest n))
-          (throw (ex-info "Invalid" {})))
-      4 (let [sym (:name r)
-              args (:args r)
-              func (if (map? v)
-                     `(fn ~args ~v ~(s/compile-html `(do ~@n)))
-                     `(fn ~args ~(s/compile-html `(do ~@(cons v n)))))]
-          [func (:doc r) (:mixins r) sym]))))
-
-(defmacro defc
-  [& args]
-  (let [[render doc mixins cname] (parse-defc args)]
-    `(def ~cname ~doc (uxbox.util.mixins/lazy-component rum/build-defc ~render ~mixins ~(str cname)))))
-
-(defmacro defcs
-  [& args]
-  (let [[render doc mixins cname] (parse-defc args)]
-    `(def ~cname ~doc (uxbox.util.mixins/lazy-component rum/build-defcs ~render ~mixins ~(str cname)))))
-
-
diff --git a/frontend/src/uxbox/util/mixins.cljs b/frontend/src/uxbox/util/mixins.cljs
deleted file mode 100644
index 131a512e5..000000000
--- a/frontend/src/uxbox/util/mixins.cljs
+++ /dev/null
@@ -1,59 +0,0 @@
-;; This Source Code Form is subject to the terms of the Mozilla Public
-;; License, v. 2.0. If a copy of the MPL was not distributed with this
-;; file, You can obtain one at http://mozilla.org/MPL/2.0/.
-;;
-;; Copyright (c) 2016 Andrey Antukh <niwi@niwi.nz>
-
-(ns uxbox.util.mixins
-  (:refer-clojure :exclude [concat])
-  (:require [sablono.core :refer-macros [html]]
-            [sablono.server :as server]
-            [rum.core :as rum]
-            [lentes.core :as l]
-            [goog.dom.forms :as gforms]))
-
-(extend-type cljs.core.UUID
-  INamed
-  (-name [this] (str this))
-  (-namespace [_] ""))
-
-(defn component
-  [{:keys [render] :as spec}]
-  {:pre [(ifn? render)]}
-  (let [name (or (:name spec) (str (gensym "rum-")))
-        mixins (or (:mixins spec) [])
-        spec (dissoc spec :name :mixins :render)
-        render' (fn [state]
-                  [(apply render state (:rum/args state)) state])
-        mixins (conj mixins spec)]
-    (rum/build-ctor render' mixins name)))
-
-(defn concat
-  [& elements]
-  (html
-   (for [[i element] (map-indexed vector elements)]
-     (rum/with-key element (str i)))))
-
-(defn local
-  ([]
-   (rum/local {} :rum/local))
-  ([initial]
-   (rum/local initial :rum/local))
-  ([initial key]
-   (rum/local initial key)))
-
-(defn lazy-component
-  [builder render mixins display-name]
-  (let [ctor (delay (builder render mixins display-name))]
-    (fn [& args]
-      (apply @ctor args))))
-
-(def mount rum/mount)
-(def static rum/static)
-(def ref-node rum/ref-node)
-(def dom-node rum/dom-node)
-(def react rum/react)
-(def reactive rum/reactive)
-(def with-key rum/with-key)
-(def render-html server/render)
-(def render-static-html server/render-static)
diff --git a/frontend/src/uxbox/view/ui.cljs b/frontend/src/uxbox/view/ui.cljs
index aa70c7243..8cbc2c235 100644
--- a/frontend/src/uxbox/view/ui.cljs
+++ b/frontend/src/uxbox/view/ui.cljs
@@ -16,7 +16,7 @@
             [uxbox.util.i18n :refer [tr]]
             [uxbox.util.data :refer [parse-int]]
             [uxbox.util.messages :as uum]
-            [uxbox.util.mixins :as mx :include-macros true]
+            [rumext.core :as mx :include-macros true]
             [uxbox.util.dom :as dom]))
 
 
diff --git a/frontend/src/uxbox/view/ui/loader.cljs b/frontend/src/uxbox/view/ui/loader.cljs
index 75e08415e..92b582bba 100644
--- a/frontend/src/uxbox/view/ui/loader.cljs
+++ b/frontend/src/uxbox/view/ui/loader.cljs
@@ -7,7 +7,7 @@
 (ns uxbox.view.ui.loader
   (:require [uxbox.builtins.icons :as i]
             [uxbox.view.store :as st]
-            [uxbox.util.mixins :as mx :include-macros true]))
+            [rumext.core :as mx :include-macros true]))
 
 ;; --- Component
 
diff --git a/frontend/src/uxbox/view/ui/notfound.cljs b/frontend/src/uxbox/view/ui/notfound.cljs
index 36720579c..ca85cef62 100644
--- a/frontend/src/uxbox/view/ui/notfound.cljs
+++ b/frontend/src/uxbox/view/ui/notfound.cljs
@@ -2,22 +2,13 @@
 ;; License, v. 2.0. If a copy of the MPL was not distributed with this
 ;; file, You can obtain one at http://mozilla.org/MPL/2.0/.
 ;;
-;; Copyright (c) 2016 Andrey Antukh <niwi@niwi.nz>
-;; Copyright (c) 2016 Juan de la Cruz <delacruzgarciajuan@gmail.com>
+;; Copyright (c) 2016-2017 Andrey Antukh <niwi@niwi.nz>
+;; Copyright (c) 2016-2017 Juan de la Cruz <delacruzgarciajuan@gmail.com>
 
 (ns uxbox.view.ui.notfound
-  (:require [sablono.core :refer-macros [html]]
-            [uxbox.util.mixins :as mx :include-macros true]))
-
-(defn notfound-page-render
-  [own]
-  (html
-   [:div
-    [:strong "Not Found"]]))
-
-(def notfound-page
-  (mx/component
-   {:render notfound-page-render
-    :name "notfound-page"
-    :mixins [mx/static]}))
+  (:require [rumext.core :as mx :include-macros true]))
 
+(mx/defc notfound-page
+  []
+  [:div
+   [:strong "Not Found"]])
diff --git a/frontend/src/uxbox/view/ui/viewer.cljs b/frontend/src/uxbox/view/ui/viewer.cljs
index e5d8fdb91..12cbac08a 100644
--- a/frontend/src/uxbox/view/ui/viewer.cljs
+++ b/frontend/src/uxbox/view/ui/viewer.cljs
@@ -9,7 +9,7 @@
   (:require [lentes.core :as l]
             [uxbox.builtins.icons :as i]
             [uxbox.util.i18n :refer [tr]]
-            [uxbox.util.mixins :as mx :include-macros true]
+            [rumext.core :as mx :include-macros true]
             [uxbox.view.store :as st]
             [uxbox.view.data.viewer :as dv]
             [uxbox.view.ui.viewer.nav :refer [nav]]
diff --git a/frontend/src/uxbox/view/ui/viewer/canvas.cljs b/frontend/src/uxbox/view/ui/viewer/canvas.cljs
index 9ee73c575..2da592c95 100644
--- a/frontend/src/uxbox/view/ui/viewer/canvas.cljs
+++ b/frontend/src/uxbox/view/ui/viewer/canvas.cljs
@@ -6,7 +6,7 @@
 ;; Copyright (c) 2016-2017 Juan de la Cruz <delacruzgarciajuan@gmail.com>
 
 (ns uxbox.view.ui.viewer.canvas
-  (:require [uxbox.util.mixins :as mx :include-macros true]
+  (:require [rumext.core :as mx :include-macros true]
             [uxbox.view.ui.viewer.shapes :as shapes]))
 
 ;; --- Background (Component)
diff --git a/frontend/src/uxbox/view/ui/viewer/nav.cljs b/frontend/src/uxbox/view/ui/viewer/nav.cljs
index 3ebd0e2cc..84e9e8c21 100644
--- a/frontend/src/uxbox/view/ui/viewer/nav.cljs
+++ b/frontend/src/uxbox/view/ui/viewer/nav.cljs
@@ -8,7 +8,7 @@
 (ns uxbox.view.ui.viewer.nav
   (:require [potok.core :as ptk]
             [uxbox.builtins.icons :as i]
-            [uxbox.util.mixins :as mx :include-macros true]
+            [rumext.core :as mx :include-macros true]
             [uxbox.view.store :as st]
             [uxbox.view.data.viewer :as dv]))
 
diff --git a/frontend/src/uxbox/view/ui/viewer/shapes.cljs b/frontend/src/uxbox/view/ui/viewer/shapes.cljs
index 66f34c671..d500a2209 100644
--- a/frontend/src/uxbox/view/ui/viewer/shapes.cljs
+++ b/frontend/src/uxbox/view/ui/viewer/shapes.cljs
@@ -19,7 +19,7 @@
             [uxbox.main.ui.shapes.path :refer [path-shape]]
             [uxbox.main.ui.shapes.circle :refer [circle-shape]]
             [uxbox.main.ui.shapes.image :refer [image-shape]]
-            [uxbox.util.mixins :as mx :include-macros true])
+            [rumext.core :as mx :include-macros true])
   (:import goog.events.EventType))
 
 (def itx-flag-ref
diff --git a/frontend/src/uxbox/view/ui/viewer/sitemap.cljs b/frontend/src/uxbox/view/ui/viewer/sitemap.cljs
index 15b888d45..6155bed81 100644
--- a/frontend/src/uxbox/view/ui/viewer/sitemap.cljs
+++ b/frontend/src/uxbox/view/ui/viewer/sitemap.cljs
@@ -11,7 +11,7 @@
             [potok.core :as ptk]
             [uxbox.builtins.icons :as i]
             [uxbox.util.i18n :refer [tr]]
-            [uxbox.util.mixins :as mx :include-macros true]
+            [rumext.core :as mx :include-macros true]
             [uxbox.util.data :refer [parse-int]]
             [uxbox.view.data.viewer :as dv]
             [uxbox.view.store :as st]))