diff --git a/app/views/organizations/_header.html.erb b/app/views/organizations/_header.html.erb
index 2cee56444..609c9a01e 100644
--- a/app/views/organizations/_header.html.erb
+++ b/app/views/organizations/_header.html.erb
@@ -36,30 +36,30 @@
         <div class="profile-header__meta">
           <% if @organization.location.present? %>
             <span class="profile-header__meta__item">
-              <%= inline_svg_tag("location.svg", aria: true, class: "crayons-icon mr-2 shrink-0", title: t("views.organizations.location.icon")) %>
+              <%= crayons_icon_tag(:location, css_class: "mr-2 shrink-0", title: t("views.organizations.location.icon")) %>
               <%= sanitize @organization.location %>
             </span>
           <% end %>
 
           <span class="profile-header__meta__item">
-            <%= inline_svg_tag("cake.svg", aria: true, class: "crayons-icon mr-2 shrink-0", title: t("views.organizations.joined.icon")) %>
+            <%= crayons_icon_tag(:cake, css_class: "mr-2 shrink-0", title: t("views.organizations.joined.icon")) %>
             <%= t("views.organizations.joined.text_html", date: local_date(@user.created_at)) %>
           </span>
 
           <span class="profile-header__meta__item -ml-1">
             <% if @user.twitter_username.present? %>
               <a href="https://twitter.com/<%= @user.twitter_username %>" target="_blank" rel="noopener me" class="px-1 align-middle inline-block">
-                <%= inline_svg_tag("twitter.svg", class: "crayons-icon", aria: true, title: t("views.organizations.twitter.icon")) %>
+                <%= crayons_icon_tag(:twitter, title: t("views.organizations.twitter.icon")) %>
               </a>
             <% end %>
             <% if @user.github_username.present? %>
               <a href="https://github.com/<%= @user.github_username %>" target="_blank" rel="noopener me" class="px-1 align-middle inline-block">
-                <%= inline_svg_tag("github.svg", class: "crayons-icon", aria: true, title: t("views.organizations.github.icon")) %>
+                <%= crayons_icon_tag(:github, title: t("views.organizations.github.icon")) %>
               </a>
             <% end %>
             <% if @user.profile.website_url.present? %>
               <a href="<%= @user.profile.website_url %>" target="_blank" rel="noopener nofollow me" class="px-1 align-middle inline-block">
-                <%= inline_svg_tag("external-link.svg", class: "crayons-icon", aria: true, title: t("views.organizations.external.icon")) %>
+                <%= crayons_icon_tag("external-link", title: t("views.organizations.external.icon")) %>
               </a>
             <% end %>
           </span>
diff --git a/app/views/users/_account.html.erb b/app/views/users/_account.html.erb
index 1085fbc45..18ae90ded 100644
--- a/app/views/users/_account.html.erb
+++ b/app/views/users/_account.html.erb
@@ -95,7 +95,7 @@
         <%= hidden_field_tag :provider, provider.provider_name %>
 
         <button class="crayons-btn crayons-btn--danger crayons-btn--icon-left" type="submit">
-          <%= inline_svg_tag("#{provider.provider_name}.svg", aria: true, class: "crayons-icon", title: provider.official_name) %>
+          <%= crayons_icon_tag(provider.provider_name, title: provider.official_name) %>
           <%= t("views.settings.account.remove.submit", provider: provider.official_name) %>
         </button>
       <% end %>
diff --git a/app/views/users/_additional_authentication.html.erb b/app/views/users/_additional_authentication.html.erb
index 2e38b4e1a..5332e3ad4 100644
--- a/app/views/users/_additional_authentication.html.erb
+++ b/app/views/users/_additional_authentication.html.erb
@@ -10,7 +10,7 @@
       <% unless @user.authenticated_through?(provider.provider_name) %>
         <%= form_with url: provider.sign_in_path(state: "profile"), class: "flex w-100", local: true do |f| %>
           <%= f.button type: :submit, class: "crayons-btn crayons-btn--icon-left crayons-btn--brand-#{provider.provider_name} m-1" do %>
-            <%= inline_svg_tag("#{provider.provider_name}.svg", aria: true, class: "crayons-icon", title: provider.provider_name) %>
+            <%= crayons_icon_tag(provider.provider_name, title: provider.official_name) %>
             <%= t("views.settings.account.connect", provider: provider.official_name) %>
           <% end %>
         <% end %>
diff --git a/app/views/users/_main_feed.html.erb b/app/views/users/_main_feed.html.erb
index 27f6f6a7c..a76dcf0a4 100644
--- a/app/views/users/_main_feed.html.erb
+++ b/app/views/users/_main_feed.html.erb
@@ -2,7 +2,7 @@
   <div class="crayons-card mb-2 border-2 border-solid border-accent-brand">
     <header>
       <h3 class="crayons-subtitle-3 inline-flex items-center bg-accent-brand color-base-inverted pl-3 pr-4 py-2 ml-4 -mt-2 radius-default">
-        <%= inline_svg_tag("pin.svg", aria: true, class: "crayons-icon mr-2", title: t("views.users.pin_icon")) %>
+        <%= crayons_icon_tag(:pin, css_class: "mr-2", title: t("views.users.pin_icon")) %>
         <%= t("views.users.pinned") %>
       </h3>
     </header>
diff --git a/app/views/users/_org_admin.html.erb b/app/views/users/_org_admin.html.erb
index dc5c574cc..895112898 100644
--- a/app/views/users/_org_admin.html.erb
+++ b/app/views/users/_org_admin.html.erb
@@ -59,7 +59,7 @@
       <%= t("views.settings.org.admin.secret_code") %>
       <clipboard-copy for="settings-org-secret" onclick="nextElementSibling.hidden = false">
         <input type="text" class="ff-monospace ff-s fw-medium" id="settings-org-secret" value="<%= @organization.secret %>" readonly aria-label="<%= t("views.settings.org.admin.copy.aria_label") %>">
-        <%= inline_svg_tag("copy.svg", aria: true, class: "crayons-icon", title: t("views.settings.org.admin.copy.icon")) %>
+        <%= crayons_icon_tag(:copy, title: t("views.settings.org.admin.copy.icon")) %>
       </clipboard-copy>
       <span class="copy-text-announcer" id="copy-text-announcer" role="alert" hidden><%= t("views.settings.org.admin.copy.text") %></span>
   </div>
diff --git a/app/views/users/_sidebar.html.erb b/app/views/users/_sidebar.html.erb
index 993fe3a99..e42ecf1c7 100644
--- a/app/views/users/_sidebar.html.erb
+++ b/app/views/users/_sidebar.html.erb
@@ -50,7 +50,7 @@
   <% cache "user-profile-sidebar-stats-#{@user.id}-#{@user.last_article_at&.rfc3339}-#{@user.last_comment_at&.rfc3339}-#{@user.following_tags_count}-#{@user.last_followed_at&.rfc3339}", expires_in: 10.days do %>
     <div class="crayons-card crayons-card--secondary p-4">
       <div class="flex items-center mb-4">
-        <%= inline_svg_tag("post.svg", aria: true, class: "crayons-icon mr-3 color-base-50", title: t("views.users.side.post.icon")) %>
+        <%= crayons_icon_tag(:post, css_class: "mr-3 color-base-50", title: t("views.users.side.post.icon")) %>
         <%= t "views.users.side.post.text", count: @user.articles.published.size %>
       </div>
       <div class="flex items-center mb-4">
diff --git a/app/views/users/edit.html.erb b/app/views/users/edit.html.erb
index 265d6759b..ccfe77c58 100644
--- a/app/views/users/edit.html.erb
+++ b/app/views/users/edit.html.erb
@@ -43,7 +43,7 @@
       <nav class="hidden m:block" aria-label="Settings">
         <% Constants::Settings::TAB_LIST.each do |possible_tab| %>
           <a class="crayons-link crayons-link--block <% if @tab == possible_tab.downcase.tr(' ', '-') %>crayons-link--current<% end %>" href="/settings/<%= possible_tab.downcase.tr(" ", "-") %>">
-            <%= inline_svg_tag("twemoji/#{possible_tab.downcase.tr(' ', '-')}", aria: true, class: "crayons-icon crayons-icon--default", title: t("views.settings.tab.#{possible_tab}")) %>
+            <%= crayons_icon_tag("twemoji/#{possible_tab.downcase.tr(' ', '-')}", native: true, title: t("views.settings.tab.#{possible_tab}")) %>
             <%= t("views.settings.tab.#{possible_tab}") %>
           </a>
         <% end %>
diff --git a/app/views/users/show.html.erb b/app/views/users/show.html.erb
index 870854f4e..352fc5854 100644
--- a/app/views/users/show.html.erb
+++ b/app/views/users/show.html.erb
@@ -35,7 +35,7 @@
               <button id="user-follow-butt" class="crayons-btn whitespace-nowrap follow-action-button follow-user" data-info='{"id":<%= @user.id %>,"className":"<%= @user.class.name %>", "name": "<%= @user.name %>"}'><%= t("views.users.follow") %></button>
         <div class="profile-dropdown ml-2 s:relative hidden" data-username="<%= @user.username %>">
               <button id="user-profile-dropdown" aria-expanded="false" aria-controls="user-profile-dropdownmenu" aria-haspopup="true" class="crayons-btn crayons-btn--ghost-dimmed crayons-btn--icon">
-                <%= inline_svg_tag("overflow-horizontal.svg", class: "dropdown-icon crayons-icon", aria: true, title: t("views.users.dropdown")) %>
+                <%= crayons_icon_tag("overflow-horizontal", css_class: "dropdown-icon", title: t("views.users.dropdown")) %>
               </button>
 
               <div id="user-profile-dropdownmenu" class="crayons-dropdown left-2 right-2 s:right-0 s:left-auto top-100 mt-1">
@@ -65,33 +65,33 @@
           <div class="profile-header__meta">
             <% if @user.profile.location.present? %>
               <span class="profile-header__meta__item">
-                <%= inline_svg_tag("location.svg", aria: true, class: "crayons-icon mr-2 shrink-0", title: t("views.users.location_icon")) %>
+                <%= crayons_icon_tag(:location, css_class: "mr-2 shrink-0", title: t("views.users.location_icon")) %>
                 <%= @user.profile.location %>
               </span>
             <% end %>
 
             <span class="profile-header__meta__item">
-              <%= inline_svg_tag("cake.svg", aria: true, class: "crayons-icon mr-2 shrink-0", title: t("views.users.joined.icon")) %>
+              <%= crayons_icon_tag(:cake, css_class: "mr-2 shrink-0", title: t("views.users.joined.icon")) %>
               <%= t("views.users.joined.text_html", date: local_date(@user.created_at)) %>
             </span>
 
             <% if @user.setting.display_email_on_profile %>
               <a href="mailto:<%= @user.email %>" class="profile-header__meta__item">
-                <%= inline_svg_tag("email.svg", class: "crayons-icon mr-2 shrink-0", aria: true, title: t("views.users.email_icon")) %>
+                <%= crayons_icon_tag(:email, css_class: "mr-2 shrink-0", title: t("views.users.email_icon")) %>
                 <%= @user.email %>
               </a>
             <% end %>
 
             <% if @user.profile.website_url.present? %>
               <a href="<%= @user.profile.website_url %>" target="_blank" rel="noopener me <%= "ugc" unless @user.trusted? %>" class="profile-header__meta__item">
-                <%= inline_svg_tag("external-link.svg", class: "crayons-icon mr-2 shrink-0", aria: true, title: t("views.users.website")) %>
+                <%= crayons_icon_tag("external-link", css_class: "mr-2 shrink-0", title: t("views.users.website")) %>
                 <%= @user.profile.website_url %>
               </a>
             <% end %>
 
             <% social_authentication_links_for(@user).each do |provider_name, url| %>
               <a href="<%= url %>" target="_blank" rel="noopener me" class="profile-header__meta__item p-1">
-                <%= inline_svg_tag("#{provider_name}.svg", class: "crayons-icon shrink-0", aria: true, title: t("views.users.social", service: provider_name)) %>
+                <%= crayons_icon_tag(provider_name, css_class: "shrink-0", title: t("views.users.social", service: provider_name)) %>
               </a>
             <% end %>
           </div>