diff --git a/src/quo2/screens/main.cljs b/src/quo2/screens/main.cljs
index d7e12684a8..4a93d7d21d 100644
--- a/src/quo2/screens/main.cljs
+++ b/src/quo2/screens/main.cljs
@@ -4,6 +4,8 @@
             [quo.design-system.colors :as colors]
             [quo.react-native :as rn]
             [quo.theme :as theme]
+            [quo2.components.markdown.text :as quo2-text]
+            [quo2.components.buttons.button :as quo2-button]
             [quo2.screens.avatars.icon-avatar :as icon-avatar]
             [quo2.screens.avatars.group-avatar :as group-avatar]
             [quo2.screens.avatars.user-avatar :as user-avatar]
@@ -27,69 +29,72 @@
             [quo2.screens.wallet.token-overview :as token-overview]
             [re-frame.core :as re-frame]))
 
-(def screens [{:name      :quo2-texts
+(def screens-categories
+  {:avatar [{:name      :group-avatar
+             :insets    {:top false}
+             :component group-avatar/preview-group-avatar}
+            {:name      :icon-avatar
+             :insets    {:top false}
+             :component icon-avatar/preview-icon-avatar}
+            {:name      :user-avatar
+             :insets    {:top false}
+             :component user-avatar/preview-user-avatar}
+            {:name      :wallet-user-avatar
+             :insets    {:top false}
+             :component wallet-user-avatar/preview-wallet-user-avatar}]
+   :buttons [{:name      :button
+              :insets    {:top false}
+              :component button/preview-button}]
+   :community [{:name      :community-cards
+                :insets    {:top false}
+                :component community-card/preview-community-card}]
+   :counter [{:name      :counter
+              :insets    {:top false}
+              :component counter/preview-counter}]
+   :info [{:name      :info-message
+           :insets    {:top false}
+           :component info-message/preview-info-message}
+          {:name      :information-box
+           :insets    {:top false}
+           :component information-box/preview-information-box}]
+   :markdown [{:name      :texts
                :insets    {:top false}
-               :component text/preview-text}
-              {:name      :quo2-wallet-user-avatar
+               :component text/preview-text}]
+   :messages [{:name      :gap
                :insets    {:top false}
-               :component wallet-user-avatar/preview-wallet-user-avatar}
-              {:name      :quo2-user-avatar
-               :insets    {:top false}
-               :component user-avatar/preview-user-avatar}
-              {:name      :quo2-react
-               :insets    {:top false}
-               :component react/preview-react}
-              {:name      :quo2-button
-               :insets    {:top false}
-               :component button/preview-button}
-              {:name      :quo2-token-overview
-               :insets    {:top false}
-               :component token-overview/preview-token-overview}
-              {:name      :quo2-icon-avatar
-               :insets    {:top false}
-               :component icon-avatar/preview-icon-avatar}
-              {:name      :quo2-status-tags
-               :insets    {:top false}
-               :component status-tags/preview-status-tags}
-              {:name      :quo2-messages-gap
-               :insets    {:top false}
-               :component messages-gap/preview-messages-gap}
-              {:name      :quo2-context-tags
-               :insets    {:top false}
-               :component context-tags/preview-context-tags}
-              {:name      :quo2-group-avatar
-               :insets    {:top false}
-               :component group-avatar/preview-group-avatar}
-              {:name      :quo2-activity-logs
-               :insets    {:top false}
-               :component activity-logs/preview-activity-logs}
-              {:name      :quo2-tabs
-               :insets    {:top false}
-               :component tabs/preview-tabs}
-              {:name      :quo2-token-tag
-               :insets    {:top false}
-               :component token-tag/preview-token-tag}
-              {:name      :quo2-segmented
-               :insets    {:top false}
-               :component segmented/preview-segmented}
-              {:name      :quo2-counter
-               :insets    {:top false}
-               :component counter/preview-counter}
-              {:name      :info-message
-               :insets    {:top false}
-               :component info-message/preview-info-message}
-              {:name      :information-box
-               :insets    {:top false}
-               :component information-box/preview-information-box}
-              {:name      :quo2-permission-tag
-               :insets    {:top false}
-               :component permission-tag/preview-permission-tag}
-              {:name      :quo2-filter-tags
-               :insets    {:top false}
-               :component filter-tags/preview-filter-tags}
-              {:name      :quo2-community-cards
-               :insets    {:top false}
-               :component community-card/preview-community-card}])
+               :component messages-gap/preview-messages-gap}]
+   :notifications [{:name      :activity-logs
+                    :insets    {:top false}
+                    :component activity-logs/preview-activity-logs}]
+   :reactions [{:name      :react
+                :insets    {:top false}
+                :component react/preview-react}]
+   :tabs [{:name      :segmented
+           :insets    {:top false}
+           :component segmented/preview-segmented}
+          {:name      :tabs
+           :insets    {:top false}
+           :component tabs/preview-tabs}]
+   :tags [{:name      :context-tags
+           :insets    {:top false}
+           :component context-tags/preview-context-tags}
+          {:name      :filter-tags
+           :insets    {:top false}
+           :component filter-tags/preview-filter-tags}
+          {:name      :permission-tag
+           :insets    {:top false}
+           :component permission-tag/preview-permission-tag}
+          {:name      :status-tags
+           :insets    {:top false}
+           :component status-tags/preview-status-tags}
+          {:name      :token-tag
+           :insets    {:top false}
+           :component token-tag/preview-token-tag}]
+   :wallet [{:name      :token-overview
+             :insets    {:top false}
+             :component token-overview/preview-token-overview}]})
+
+(def screens (flatten (map val screens-categories)))
 
 (defn theme-switcher []
   [rn/view {:style {:flex-direction   :row
@@ -124,12 +129,20 @@
                         :padding-horizontal 16
                         :background-color   (:ui-background @colors/theme)}
         [theme-switcher]
+        [quo2-text/text {:size :heading-1} "Preview Quo2 Components"]
         [rn/view
-         (for [{:keys [name]} screens]
-           ^{:key name}
-           [rn/touchable-opacity {:on-press #(re-frame/dispatch [:navigate-to name])}
-            [rn/view {:style {:padding-vertical 8}}
-             [quo/text (str "Preview " name)]]])]])]))
+         (map (fn [category]
+                [rn/view  {:style {:margin-vertical 8}}
+                 [quo2-text/text
+                  {:weight :semi-bold
+                   :size :heading-2}
+                  (clojure.core/name (key category))]
+                 (for [{:keys [name]} (val category)]
+                   ^{:key name}
+                   [quo2-button/button
+                    {:style {:margin-vertical 8}
+                     :on-press #(re-frame/dispatch [:navigate-to name])}
+                    (clojure.core/name name)])]) (sort screens-categories))]])]))
 
 (def main-screens [{:name      :quo2-preview
                     :insets    {:top false}