diff --git a/src/backend/effects/builtin/twitch/stream-game.ts b/src/backend/effects/builtin/twitch/stream-game.ts
index 4d3027056..ff96a57c3 100644
--- a/src/backend/effects/builtin/twitch/stream-game.ts
+++ b/src/backend/effects/builtin/twitch/stream-game.ts
@@ -5,7 +5,7 @@ import twitchApi from "../../../twitch-api/api";
 import eventsManager from "../../../events/EventManager";
 
 const model: EffectType<{
-    mode: "specific" | "custom";
+    mode: "specific" | "custom" | "clear";
     gameId: string;
     gameName: string;
 }> = {
@@ -30,6 +30,10 @@ const model: EffectType<{
                     <input type="radio" ng-model="effect.mode" value="custom"/>
                     <div class="control__indicator"></div>
                 </label>
+                <label class="control-fb control--radio">Clear category
+                    <input type="radio" ng-model="effect.mode" value="clear"/>
+                    <div class="control__indicator"></div>
+                </label>
             </div>
         </eos-container>
 
@@ -97,11 +101,16 @@ const model: EffectType<{
             await twitchApi.channels.updateChannelInformation({
                 gameId: event.effect.gameId
             });
-        } else {
-            const categories = await twitchApi.categories.searchCategories(event.effect.gameName.trim());
+        } else if (event.effect.mode === "clear" || event.effect.mode === "custom" && !event.effect.gameName) {
+            //user left the gamename blank
+            await twitchApi.channels.updateChannelInformation({
+                gameId: ''
+            });
+        } else if (event.effect.mode === "custom") {
+            const categories = await twitchApi.categories.searchCategories(event.effect.gameName?.trim());
             if (categories?.length) {
                 const category =
-                    categories.find((c) => c.name.toLowerCase() === event.effect.gameName.toLowerCase()) ??
+                    categories.find(c => c.name.toLowerCase() === event.effect.gameName.toLowerCase()) ??
                     categories[0];
 
                 if (!category) {
diff --git a/src/gui/app/directives/modals/misc/edit-stream-info-modal.js b/src/gui/app/directives/modals/misc/edit-stream-info-modal.js
index 7ea813adc..885072288 100644
--- a/src/gui/app/directives/modals/misc/edit-stream-info-modal.js
+++ b/src/gui/app/directives/modals/misc/edit-stream-info-modal.js
@@ -34,20 +34,31 @@
 
                         <div class="form-group">
                             <label for="game" class="control-label">Category</label>
-                            <ui-select ng-model="$ctrl.selectedGame" required input-id="game" theme="bootstrap" spinner-enabled="true" on-select="$ctrl.gameSelected($item)">
-                                <ui-select-match placeholder="Search for category...">
-                                    <div style="height: 25px; display:flex; flex-direction: row; align-items: center;">
-                                        <img style="height: 21px; width: 21px; border-radius: 5px; margin-right:5px;" ng-src="{{$select.selected.boxArtUrl}}">
-                                        <div style="font-weight: 100;font-size: 17px;">{{$select.selected.name}}</div>
-                                    </div>
-                                </ui-select-match>
-                                <ui-select-choices minimum-input-length="1" repeat="game in $ctrl.games | filter: $select.search" refresh="$ctrl.searchGames($select.search)" refresh-delay="200" style="position:relative;">
-                                    <div style="height: 35px; display:flex; flex-direction: row; align-items: center;">
-                                        <img style="height: 30px; width: 30px; border-radius: 5px; margin-right:10px;" ng-src="{{game.boxArtUrl}}">
-                                        <div style="font-weight: 100;font-size: 17px;">{{game.name}}</div>
-                                    </div>
-                                </ui-select-choices>
-                            </ui-select>
+                            <div style="display:flex">
+                                <ui-select style="width: 100%" ng-model="$ctrl.selectedGame" required input-id="game" theme="bootstrap" spinner-enabled="true" on-select="$ctrl.gameSelected($item)">
+                                    <ui-select-match placeholder="Search for category...">
+                                        <div style="height: 25px; display:flex; flex-direction: row; align-items: center;">
+                                            <img style="height: 21px; width: 21px; border-radius: 5px; margin-right:5px;" ng-src="{{$select.selected.boxArtUrl}}">
+                                            <div style="font-weight: 100;font-size: 17px;">{{$select.selected.name}}</div>
+                                        </div>
+                                    </ui-select-match>
+                                    <ui-select-choices minimum-input-length="1" repeat="game in $ctrl.games | filter: $select.search" refresh="$ctrl.searchGames($select.search)" refresh-delay="200" style="position:relative;">
+                                        <div style="height: 35px; display:flex; flex-direction: row; align-items: center;">
+                                            <img style="height: 30px; width: 30px; border-radius: 5px; margin-right:10px;" ng-src="{{game.boxArtUrl}}">
+                                            <div style="font-weight: 100;font-size: 17px;">{{game.name}}</div>
+                                        </div>
+                                    </ui-select-choices>
+                                </ui-select>
+                                <div ng-show="$ctrl.selectedGame != null" style="margin-left: 3px">
+                                    <button 
+                                        class="btn btn-default"
+                                        aria-label="Clear category"
+                                        uib-tooltip="Clear category"     
+                                        ng-click="$ctrl.removeCategory()">
+                                        <i class="far fa-times"></i>
+                                    </button>
+                                </div>
+                            </div>
                         </div>
 
                         <div class="form-group" style="margin-bottom: 0;">
@@ -146,7 +157,7 @@
                             saveText: "Add",
                             inputPlaceholder: "Enter a tag",
                             validationFn: (value) => {
-                                return new Promise(resolve => {
+                                return new Promise((resolve) => {
                                     // Must be alphanumeric no more than 25 characters
                                     const tagRegExp = /^[a-z0-9]{1,25}$/ig;
 
@@ -170,7 +181,7 @@
 
                 $ctrl.searchGames = function(gameQuery) {
                     backendCommunicator.fireEventAsync("search-twitch-games", gameQuery)
-                        .then(games => {
+                        .then((games) => {
                             if (games != null) {
                                 $ctrl.games = games;
                             }
@@ -184,6 +195,12 @@
                     }
                 };
 
+                $ctrl.removeCategory = function() {
+                    $ctrl.selectedGame = null;
+                    $ctrl.streamInfo.gameId = '';
+                    $ctrl.streamInfo.gameName = null;
+                };
+
                 $ctrl.removeStreamTag = function(tag) {
                     $ctrl.streamInfo.tags = $ctrl.streamInfo.tags.filter(element => tag.toLowerCase() !== element.toLowerCase());
                 };