diff --git a/cookbook/serializer.py b/cookbook/serializer.py
index bb7bbf62..d4f7bd47 100644
--- a/cookbook/serializer.py
+++ b/cookbook/serializer.py
@@ -283,6 +283,13 @@ class SpaceSerializer(WritableNestedModelSerializer):
     image = UserFileViewSerializer(required=False, many=False, allow_null=True)
     nav_logo = UserFileViewSerializer(required=False, many=False, allow_null=True)
     custom_space_theme = UserFileViewSerializer(required=False, many=False, allow_null=True)
+    logo_color_32 = UserFileViewSerializer(required=False, many=False, allow_null=True)
+    logo_color_128 = UserFileViewSerializer(required=False, many=False, allow_null=True)
+    logo_color_144 = UserFileViewSerializer(required=False, many=False, allow_null=True)
+    logo_color_180 = UserFileViewSerializer(required=False, many=False, allow_null=True)
+    logo_color_192 = UserFileViewSerializer(required=False, many=False, allow_null=True)
+    logo_color_512 = UserFileViewSerializer(required=False, many=False, allow_null=True)
+    logo_color_svg = UserFileViewSerializer(required=False, many=False, allow_null=True)
 
     def get_user_count(self, obj):
         return UserSpace.objects.filter(space=obj).count()
@@ -304,7 +311,8 @@ class SpaceSerializer(WritableNestedModelSerializer):
         fields = (
             'id', 'name', 'created_by', 'created_at', 'message', 'max_recipes', 'max_file_storage_mb', 'max_users',
             'allow_sharing', 'demo', 'food_inherit', 'user_count', 'recipe_count', 'file_size_mb',
-            'image', 'nav_logo', 'space_theme', 'custom_space_theme', 'nav_bg_color', 'nav_text_color', 'use_plural',)
+            'image', 'nav_logo', 'space_theme', 'custom_space_theme', 'nav_bg_color', 'nav_text_color', 'use_plural',
+            'logo_color_32', 'logo_color_128', 'logo_color_144', 'logo_color_180', 'logo_color_192', 'logo_color_512', 'logo_color_svg',)
         read_only_fields = (
             'id', 'created_by', 'created_at', 'max_recipes', 'max_file_storage_mb', 'max_users', 'allow_sharing',
             'demo',)
diff --git a/vue/src/apps/SpaceManageView/SpaceManageView.vue b/vue/src/apps/SpaceManageView/SpaceManageView.vue
index 3dab190a..01bf7e23 100644
--- a/vue/src/apps/SpaceManageView/SpaceManageView.vue
+++ b/vue/src/apps/SpaceManageView/SpaceManageView.vue
@@ -191,6 +191,37 @@
                     </b-form-select>
                 </b-form-group>
 
+                <h5>{{ $t('CustomLogos') }}</h5>
+                <p>{{$t('CustomLogoHelp')}} </p>
+                <b-form-group :label="$t('Logo')+' 32x32px'">
+                    <generic-multiselect :initial_single_selection="space.logo_color_32"
+                                         :model="Models.USERFILE" :multiple="false" @change="space.logo_color_32 = $event.val;"></generic-multiselect>
+                </b-form-group>
+                <b-form-group :label="$t('Logo')+' 128x128px'">
+                    <generic-multiselect :initial_single_selection="space.logo_color_128"
+                                         :model="Models.USERFILE" :multiple="false" @change="space.logo_color_128 = $event.val;"></generic-multiselect>
+                </b-form-group>
+                <b-form-group :label="$t('Logo')+' 144x144px'">
+                    <generic-multiselect :initial_single_selection="space.logo_color_144"
+                                         :model="Models.USERFILE" :multiple="false" @change="space.logo_color_144 = $event.val;"></generic-multiselect>
+                </b-form-group>
+                <b-form-group :label="$t('Logo')+' 180x180px'">
+                    <generic-multiselect :initial_single_selection="space.logo_color_180"
+                                         :model="Models.USERFILE" :multiple="false" @change="space.logo_color_180 = $event.val;"></generic-multiselect>
+                </b-form-group>
+                <b-form-group :label="$t('Logo')+' 192x192px'">
+                    <generic-multiselect :initial_single_selection="space.logo_color_192"
+                                         :model="Models.USERFILE" :multiple="false" @change="space.logo_color_192 = $event.val;"></generic-multiselect>
+                </b-form-group>
+                <b-form-group :label="$t('Logo')+' 512x512px'">
+                    <generic-multiselect :initial_single_selection="space.logo_color_512"
+                                         :model="Models.USERFILE" :multiple="false" @change="space.logo_color_512 = $event.val;"></generic-multiselect>
+                </b-form-group>
+                <b-form-group :label="$t('Logo')+' SVG'">
+                    <generic-multiselect :initial_single_selection="space.logo_color_svg"
+                                         :model="Models.USERFILE" :multiple="false" @change="space.logo_color_svg = $event.val;"></generic-multiselect>
+                </b-form-group>
+
                 <b-button variant="success" @click="updateSpace()">{{ $t('Update') }}</b-button>
             </b-col>
         </b-row>
diff --git a/vue/src/locales/en.json b/vue/src/locales/en.json
index 5dc72049..e085bd92 100644
--- a/vue/src/locales/en.json
+++ b/vue/src/locales/en.json
@@ -284,7 +284,9 @@
 	"CustomTheme": "Custom Theme",
 	"CustomThemeHelp": "Override styles of the selected theme by uploading a custom CSS file.",
 	"CustomImageHelp": "Upload an image to show in the space overview.",
-	"CustomNavLogoHelp": "Upload an image to use as the space logo.",
+	"CustomNavLogoHelp": "Upload an image to use as the navigation bar logo.",
+	"CustomLogoHelp": "Upload square images in different sizes to change to logo in the browser tab and installed web app.",
+	"CustomLogos": "Custom Logos",
 	"SupermarketCategoriesOnly": "Supermarket Categories Only",
 	"MoveCategory": "Move To: ",
 	"CountMore": "...+{count} more",