diff --git a/templates/org/home.tmpl b/templates/org/home.tmpl
index 27f0df0b385e8..97047c71cc01a 100644
--- a/templates/org/home.tmpl
+++ b/templates/org/home.tmpl
@@ -10,7 +10,7 @@
 					{{if .Org.Visibility.IsPrivate}}<span class="ui large basic horizontal label">{{.locale.Tr "org.settings.visibility.private_shortname"}}</span>{{end}}
 				</span>
 				{{if .EnableFeed}}
-					<a class="muted" href="{{.Org.HomeLink}}.rss" data-tooltip-content="{{.locale.Tr "rss_feed"}}">{{svg "octicon-rss" 24}}</a>
+					<a class="rss-icon gt-mx-3" href="{{.Org.HomeLink}}.rss" data-tooltip-content="{{.locale.Tr "rss_feed"}}">{{svg "octicon-rss" 24}}</a>
 				{{end}}
 			</div>
 			{{if $.RenderedDescription}}<div class="render-content markup">{{$.RenderedDescription|Str2html}}</div>{{end}}
diff --git a/templates/repo/header.tmpl b/templates/repo/header.tmpl
index b2fd0710afb01..03f5a2e78fedf 100644
--- a/templates/repo/header.tmpl
+++ b/templates/repo/header.tmpl
@@ -36,7 +36,7 @@
 						{{end}}
 					</div>
 					{{if $.EnableFeed}}
-						<a class="muted gt-ml-3" href="{{$.RepoLink}}.rss" data-tooltip-content="{{$.locale.Tr "rss_feed"}}">{{svg "octicon-rss" 18}}</a>
+						<a class="rss-icon gt-ml-3" href="{{$.RepoLink}}.rss" data-tooltip-content="{{$.locale.Tr "rss_feed"}}">{{svg "octicon-rss" 18}}</a>
 					{{end}}
 				</div>
 				{{if $.IsPullMirror}}
diff --git a/templates/repo/release_tag_header.tmpl b/templates/repo/release_tag_header.tmpl
index 6d022eebccaca..d8f60a2c6cf4c 100644
--- a/templates/repo/release_tag_header.tmpl
+++ b/templates/repo/release_tag_header.tmpl
@@ -11,7 +11,7 @@
 				{{end}}
 			</h2>
 			{{if .EnableFeed}}
-				<a class="muted gt-mx-3" href="{{.RepoLink}}/{{if .PageIsTagList}}tags{{else}}releases{{end}}.rss" data-tooltip-content="{{.locale.Tr "rss_feed"}}">{{svg "octicon-rss" 18}}</a>
+				<a class="rss-icon gt-mx-3" href="{{.RepoLink}}/{{if .PageIsTagList}}tags{{else}}releases{{end}}.rss" data-tooltip-content="{{.locale.Tr "rss_feed"}}">{{svg "octicon-rss" 18}}</a>
 			{{end}}
 		</div>
 		{{if and (not .PageIsTagList) .CanCreateRelease}}
diff --git a/web_src/css/base.css b/web_src/css/base.css
index aa86d140fe4b4..3663511fef4ce 100644
--- a/web_src/css/base.css
+++ b/web_src/css/base.css
@@ -364,12 +364,6 @@ a.label,
   text-decoration: none !important;
 }
 
-/* for most cases, we only use our svg icon as inline icon, so we need to make them inline-block and vertical-align: middle */
-svg.svg {
-  display: inline-block;
-  vertical-align: middle;
-}
-
 .ui.red.labels .label,
 .ui.ui.ui.red.label,
 .ui.red.button,
@@ -2595,6 +2589,11 @@ a.ui.basic.label:hover {
   line-height: .67em;
 }
 
+.rss-icon {
+  display: inline-flex;
+  color: var(--color-text-light-1);
+}
+
 table th[data-sortt-asc]:hover,
 table th[data-sortt-desc]:hover {
   background: rgba(0, 0, 0, 0.1) !important;
diff --git a/web_src/js/components/RepoBranchTagSelector.vue b/web_src/js/components/RepoBranchTagSelector.vue
index f02918da9aa7f..6be09251bc2e6 100644
--- a/web_src/js/components/RepoBranchTagSelector.vue
+++ b/web_src/js/components/RepoBranchTagSelector.vue
@@ -39,7 +39,7 @@
       <div class="scrolling menu" ref="scrollContainer">
         <div v-for="(item, index) in filteredItems" :key="item.name" class="item" :class="{selected: item.selected, active: active === index}" @click="selectItem(item)" :ref="'listItem' + index">
           {{ item.name }}
-          <a v-if="enableFeed && mode === 'branches'" role="button" class="ui compact right muted" :href="rssURLPrefix + item.url" target="_blank" @click.stop>
+          <a v-if="enableFeed && mode === 'branches'" role="button" class="rss-icon ui compact right" :href="rssURLPrefix + item.url" target="_blank" @click.stop>
             <svg-icon name="octicon-rss" :size="14"/>
           </a>
         </div>