diff --git a/site/plugins/admin/dependencies.php b/site/plugins/admin/dependencies.php
index dd4edaec..16ce2b4f 100644
--- a/site/plugins/admin/dependencies.php
+++ b/site/plugins/admin/dependencies.php
@@ -18,14 +18,14 @@ use function Flextype\Component\I18n\__;
 I18n::$locale = $flextype->registry->get('settings.locale');
 
 // Add Admin Navigation
-$flextype->registry->set('admin_navigation.content.entries', ['title' => __('admin_entries'), 'icon' => '<i class="fas fa-database"></i>', 'link' => $flextype->router->pathFor('admin.entries.index'), 'attributes' => ['class' => 'nav-link']]);
-$flextype->registry->set('admin_navigation.extends.fieldsets', ['title' => __('admin_fieldsets'),'icon' => '<i class="far fa-list-alt"></i>', 'link' => $flextype->router->pathFor('admin.fieldsets.index'), 'attributes' => ['class' => 'nav-link']]);
-$flextype->registry->set('admin_navigation.extends.themes', ['title' => __('admin_themes'),'icon' => '<i class="fas fa-palette"></i>', 'link' => $flextype->router->pathFor('admin.themes.index'), 'attributes' => ['class' => 'nav-link']]);
-$flextype->registry->set('admin_navigation.extends.snippets', ['title' => __('admin_snippets'),'icon' => '<i class="far fa-file-code"></i>', 'link' => $flextype->router->pathFor('admin.snippets.index'), 'attributes' => ['class' => 'nav-link']]);
-$flextype->registry->set('admin_navigation.extends.plugins', ['title' => __('admin_plugins'),'icon' => '<i class="fas fa-plug"></i>', 'link' => $flextype->router->pathFor('admin.plugins.index'), 'attributes' => ['class' => 'nav-link']]);
-$flextype->registry->set('admin_navigation.settings.tools', ['title' => __('admin_tools'),'icon' => '<i class="fas fa-toolbox"></i>', 'link' => $flextype->router->pathFor('admin.tools.index'), 'attributes' => ['class' => 'nav-link']]);
-$flextype->registry->set('admin_navigation.settings.settings', ['title' => __('admin_settings'),'icon' => '<i class="fas fa-cog"></i>', 'link' => $flextype->router->pathFor('admin.settings.index'), 'attributes' => ['class' => 'nav-link']]);
-$flextype->registry->set('admin_navigation.settings.api', ['title' => __('admin_api'),'icon' => '<i class="fas fa-network-wired"></i>', 'link' => $flextype->router->pathFor('admin.api.index'), 'attributes' => ['class' => 'nav-link']]);
+$flextype->registry->set('admin_navigation.content.entries', ['title' => __('admin_entries'), 'icon' => 'fas fa-database', 'link' => $flextype->router->pathFor('admin.entries.index'), 'attributes' => ['class' => 'nav-link']]);
+$flextype->registry->set('admin_navigation.extends.fieldsets', ['title' => __('admin_fieldsets'),'icon' => 'far fa-list-alt', 'link' => $flextype->router->pathFor('admin.fieldsets.index'), 'attributes' => ['class' => 'nav-link']]);
+$flextype->registry->set('admin_navigation.extends.themes', ['title' => __('admin_themes'),'icon' => 'fas fa-palette', 'link' => $flextype->router->pathFor('admin.themes.index'), 'attributes' => ['class' => 'nav-link']]);
+$flextype->registry->set('admin_navigation.extends.snippets', ['title' => __('admin_snippets'),'icon' => 'far fa-file-code', 'link' => $flextype->router->pathFor('admin.snippets.index'), 'attributes' => ['class' => 'nav-link']]);
+$flextype->registry->set('admin_navigation.extends.plugins', ['title' => __('admin_plugins'),'icon' => 'fas fa-plug', 'link' => $flextype->router->pathFor('admin.plugins.index'), 'attributes' => ['class' => 'nav-link']]);
+$flextype->registry->set('admin_navigation.settings.tools', ['title' => __('admin_tools'),'icon' => 'fas fa-toolbox', 'link' => $flextype->router->pathFor('admin.tools.index'), 'attributes' => ['class' => 'nav-link']]);
+$flextype->registry->set('admin_navigation.settings.settings', ['title' => __('admin_settings'),'icon' => 'fas fa-cog', 'link' => $flextype->router->pathFor('admin.settings.index'), 'attributes' => ['class' => 'nav-link']]);
+$flextype->registry->set('admin_navigation.settings.api', ['title' => __('admin_api'),'icon' => 'fas fa-network-wired', 'link' => $flextype->router->pathFor('admin.api.index'), 'attributes' => ['class' => 'nav-link']]);
 
 // Add Global Vars Admin Twig Extension
 $flextype->view->addExtension(new GlobalVarsAdminTwigExtension($flextype));
diff --git a/site/plugins/admin/templates/partials/base.html b/site/plugins/admin/templates/partials/base.html
index 3ce4327f..82de16b3 100644
--- a/site/plugins/admin/templates/partials/base.html
+++ b/site/plugins/admin/templates/partials/base.html
@@ -47,22 +47,30 @@
                     </li>
                     {% for key, item in registry.admin_navigation.content %}
                         <li>
-                            <a data-tippy-content="{{ item.title|raw }}" href="{{ base_url() }}{{ item.link|raw }}" class="js-nav navigation__item {% if key == menu_item %}navigation__item--active{% endif %}">{{ item.icon|raw }}</a>
+                            <a data-tippy-content="{{ item.title|raw }}" href="{{ base_url() }}{{ item.link|raw }}" class="js-nav navigation__item {% if key == menu_item %}navigation__item--active{% endif %}">
+                                <i class="icon icon--white">{{ icon(item.icon) }}</i>
+                            </a>
                         </li>
                     {% endfor %}
                     {% for key, item in registry.admin_navigation.extends %}
                         <li>
-                            <a data-tippy-content="{{ item.title|raw }}" href="{{ base_url() }}{{ item.link|raw }}" class="js-nav navigation__item {% if key == menu_item %}navigation__item--active{% endif %}">{{ item.icon|raw }}</a>
+                            <a data-tippy-content="{{ item.title|raw }}" href="{{ base_url() }}{{ item.link|raw }}" class="js-nav navigation__item {% if key == menu_item %}navigation__item--active{% endif %}">
+                                <i class="icon icon--white">{{ icon(item.icon) }}</i>
+                            </a>
                         </li>
                     {% endfor %}
                     {% for key, item in registry.admin_navigation.settings %}
                         <li>
-                            <a data-tippy-content="{{ item.title|raw }}" href="{{ base_url() }}{{ item.link|raw }}" class="js-nav navigation__item {% if key == menu_item %}navigation__item--active{% endif %}">{{ item.icon|raw }}</a>
+                            <a data-tippy-content="{{ item.title|raw }}" href="{{ base_url() }}{{ item.link|raw }}" class="js-nav navigation__item {% if key == menu_item %}navigation__item--active{% endif %}">
+                                <i class="icon icon--white">{{ icon(item.icon) }}</i>
+                            </a>
                         </li>
                     {% endfor %}
                     {% for key, item in registry.admin_navigation.help %}
                         <li>
-                            <a data-tippy-content="{{ item.title|raw }}" href="{{ item.link|raw }}" class="js-nav navigation__item {% if key == menu_item %}navigation__item--active{% endif %}">{{ item.icon|raw }}</a>
+                            <a data-tippy-content="{{ item.title|raw }}" href="{{ item.link|raw }}" class="js-nav navigation__item {% if key == menu_item %}navigation__item--active{% endif %}">
+                                <i class="icon icon--white">{{ icon(item.icon) }}</i>
+                            </a>
                         </li>
                     {% endfor %}
                 </ul>