diff --git a/templates/org/home.tmpl b/templates/org/home.tmpl
index 27f0df0b385e..97047c71cc01 100644
--- a/templates/org/home.tmpl
+++ b/templates/org/home.tmpl
@@ -10,7 +10,7 @@
{{if .Org.Visibility.IsPrivate}}{{.locale.Tr "org.settings.visibility.private_shortname"}}{{end}}
{{if .EnableFeed}}
- {{svg "octicon-rss" 24}}
+
{{end}}
{{if $.RenderedDescription}}
{{$.RenderedDescription|Str2html}}
{{end}}
diff --git a/templates/repo/header.tmpl b/templates/repo/header.tmpl
index b2fd0710afb0..03f5a2e78fed 100644
--- a/templates/repo/header.tmpl
+++ b/templates/repo/header.tmpl
@@ -36,7 +36,7 @@
{{end}}
{{if $.EnableFeed}}
- {{svg "octicon-rss" 18}}
+
{{end}}
{{if $.IsPullMirror}}
diff --git a/templates/repo/release_tag_header.tmpl b/templates/repo/release_tag_header.tmpl
index 6d022eebccac..d8f60a2c6cf4 100644
--- a/templates/repo/release_tag_header.tmpl
+++ b/templates/repo/release_tag_header.tmpl
@@ -11,7 +11,7 @@
{{end}}
{{if .EnableFeed}}
- {{svg "octicon-rss" 18}}
+
{{end}}
{{if and (not .PageIsTagList) .CanCreateRelease}}
diff --git a/web_src/css/base.css b/web_src/css/base.css
index aa86d140fe4b..3663511fef4c 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 f02918da9aa7..6be09251bc2e 100644
--- a/web_src/js/components/RepoBranchTagSelector.vue
+++ b/web_src/js/components/RepoBranchTagSelector.vue
@@ -39,7 +39,7 @@