diff --git a/rhodecode/apps/debug_style/__init__.py b/rhodecode/apps/debug_style/__init__.py
new file mode 100644
--- /dev/null
+++ b/rhodecode/apps/debug_style/__init__.py
@@ -0,0 +1,42 @@
+# -*- coding: utf-8 -*-
+
+# Copyright (C) 2016-2017 RhodeCode GmbH
+#
+# This program is free software: you can redistribute it and/or modify
+# it under the terms of the GNU Affero General Public License, version 3
+# (only), as published by the Free Software Foundation.
+#
+# This program is distributed in the hope that it will be useful,
+# but WITHOUT ANY WARRANTY; without even the implied warranty of
+# MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+# GNU General Public License for more details.
+#
+# You should have received a copy of the GNU Affero General Public License
+# along with this program.  If not, see <http://www.gnu.org/licenses/>.
+#
+# This program is dual-licensed. If you wish to learn more about the
+# RhodeCode Enterprise Edition, including its added features, Support services,
+# and proprietary license terms, please see https://rhodecode.com/licenses/
+from rhodecode.apps._base import ADMIN_PREFIX
+from rhodecode.lib.utils2 import str2bool
+
+
+def debug_style_enabled(info, request):
+    return str2bool(request.registry.settings.get('debug_style'))
+
+
+def includeme(config):
+    config.add_route(
+        name='debug_style_home',
+        pattern=ADMIN_PREFIX + '/debug_style',
+        custom_predicates=(debug_style_enabled,))
+    config.add_route(
+        name='debug_style_template',
+        pattern=ADMIN_PREFIX + '/debug_style/t/{t_path}',
+        custom_predicates=(debug_style_enabled,))
+
+    # Scan module for configuration decorators.
+    config.scan()
+
+
+
diff --git a/rhodecode/apps/debug_style/views.py b/rhodecode/apps/debug_style/views.py
new file mode 100644
--- /dev/null
+++ b/rhodecode/apps/debug_style/views.py
@@ -0,0 +1,58 @@
+# -*- coding: utf-8 -*-
+
+# Copyright (C) 2016-2017 RhodeCode GmbH
+#
+# This program is free software: you can redistribute it and/or modify
+# it under the terms of the GNU Affero General Public License, version 3
+# (only), as published by the Free Software Foundation.
+#
+# This program is distributed in the hope that it will be useful,
+# but WITHOUT ANY WARRANTY; without even the implied warranty of
+# MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+# GNU General Public License for more details.
+#
+# You should have received a copy of the GNU Affero General Public License
+# along with this program.  If not, see <http://www.gnu.org/licenses/>.
+#
+# This program is dual-licensed. If you wish to learn more about the
+# RhodeCode Enterprise Edition, including its added features, Support services,
+# and proprietary license terms, please see https://rhodecode.com/licenses/
+
+import os
+import logging
+
+from pyramid.view import view_config
+from pyramid.renderers import render_to_response
+from rhodecode.apps._base import BaseAppView
+
+log = logging.getLogger(__name__)
+
+
+class DebugStyleView(BaseAppView):
+    def load_default_context(self):
+        c = self._get_local_tmpl_context()
+        self._register_global_c(c)
+        return c
+
+    @view_config(
+        route_name='debug_style_home', request_method='GET',
+        renderer=None)
+    def index(self):
+        c = self.load_default_context()
+        c.active = 'index'
+
+        return render_to_response(
+            'debug_style/index.html', self._get_template_context(c),
+            request=self.request)
+
+    @view_config(
+        route_name='debug_style_template', request_method='GET',
+        renderer=None)
+    def template(self):
+        t_path = self.request.matchdict['t_path']
+        c = self.load_default_context()
+        c.active = os.path.splitext(t_path)[0]
+
+        return render_to_response(
+            'debug_style/' + t_path, self._get_template_context(c),
+            request=self.request)
\ No newline at end of file
diff --git a/rhodecode/config/middleware.py b/rhodecode/config/middleware.py
--- a/rhodecode/config/middleware.py
+++ b/rhodecode/config/middleware.py
@@ -305,6 +305,7 @@ def includeme(config):
     config.include('rhodecode.apps.svn_support')
     config.include('rhodecode.apps.gist')
 
+    config.include('rhodecode.apps.debug_style')
     config.include('rhodecode.tweens')
     config.include('rhodecode.api')
 
diff --git a/rhodecode/config/routing.py b/rhodecode/config/routing.py
--- a/rhodecode/config/routing.py
+++ b/rhodecode/config/routing.py
@@ -369,15 +369,6 @@ def make_map(config):
         m.connect('admin_defaults_repositories', '/defaults/repositories',
                   action='index', conditions={'method': ['GET']})
 
-    # ADMIN DEBUG STYLE ROUTES
-    if str2bool(config.get('debug_style')):
-        with rmap.submapper(path_prefix=ADMIN_PREFIX + '/debug_style',
-                            controller='debug_style') as m:
-            m.connect('debug_style_home', '',
-                      action='index', conditions={'method': ['GET']})
-            m.connect('debug_style_template', '/t/{t_path}',
-                      action='template', conditions={'method': ['GET']})
-
     # ADMIN SETTINGS ROUTES
     with rmap.submapper(path_prefix=ADMIN_PREFIX,
                         controller='admin/settings') as m:
diff --git a/rhodecode/controllers/debug_style.py b/rhodecode/controllers/debug_style.py
deleted file mode 100644
--- a/rhodecode/controllers/debug_style.py
+++ /dev/null
@@ -1,39 +0,0 @@
-# -*- coding: utf-8 -*-
-
-# Copyright (C) 2014-2017 RhodeCode GmbH
-#
-# This program is free software: you can redistribute it and/or modify
-# it under the terms of the GNU Affero General Public License, version 3
-# (only), as published by the Free Software Foundation.
-#
-# This program is distributed in the hope that it will be useful,
-# but WITHOUT ANY WARRANTY; without even the implied warranty of
-# MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
-# GNU General Public License for more details.
-#
-# You should have received a copy of the GNU Affero General Public License
-# along with this program.  If not, see <http://www.gnu.org/licenses/>.
-#
-# This program is dual-licensed. If you wish to learn more about the
-# RhodeCode Enterprise Edition, including its added features, Support services,
-# and proprietary license terms, please see https://rhodecode.com/licenses/
-
-"""
-Provides a few url endpoints that help understanding the styling concept.
-"""
-import os
-
-from pylons import tmpl_context as c
-
-from rhodecode.lib.base import BaseController, render
-
-
-class DebugStyleController(BaseController):
-
-    def index(self):
-        c.active = 'index'
-        return render('debug_style/index.html')
-
-    def template(self, t_path):
-        c.active = os.path.splitext(t_path)[0]
-        return render('debug_style/' + t_path)
diff --git a/rhodecode/public/js/rhodecode/routes.js b/rhodecode/public/js/rhodecode/routes.js
--- a/rhodecode/public/js/rhodecode/routes.js
+++ b/rhodecode/public/js/rhodecode/routes.js
@@ -170,5 +170,7 @@ function registerRCRoutes() {
     pyroutes.register('gist_show_rev', '/_admin/gists/%(gist_id)s/%(revision)s', ['gist_id', 'revision']);
     pyroutes.register('gist_show_formatted', '/_admin/gists/%(gist_id)s/%(revision)s/%(format)s', ['gist_id', 'revision', 'format']);
     pyroutes.register('gist_show_formatted_path', '/_admin/gists/%(gist_id)s/%(revision)s/%(format)s/%(f_path)s', ['gist_id', 'revision', 'format', 'f_path']);
+    pyroutes.register('debug_style_home', '/_admin/debug_style', []);
+    pyroutes.register('debug_style_template', '/_admin/debug_style/t/%(t_path)s', ['t_path']);
     pyroutes.register('apiv2', '/_admin/api', []);
 }
diff --git a/rhodecode/templates/base/base.mako b/rhodecode/templates/base/base.mako
--- a/rhodecode/templates/base/base.mako
+++ b/rhodecode/templates/base/base.mako
@@ -425,7 +425,7 @@
       % endif
       % if c.debug_style:
       <li class="${is_active('debug_style')}">
-          <a class="menulink" title="${_('Style')}" href="${h.url('debug_style_home')}">
+          <a class="menulink" title="${_('Style')}" href="${h.route_path('debug_style_home')}">
             <div class="menulabel">${_('Style')}</div>
           </a>
       </li>
diff --git a/rhodecode/templates/debug_style/alerts.html b/rhodecode/templates/debug_style/alerts.html
--- a/rhodecode/templates/debug_style/alerts.html
+++ b/rhodecode/templates/debug_style/alerts.html
@@ -2,7 +2,7 @@
 <%inherit file="/debug_style/index.html"/>
 
 <%def name="breadcrumbs_links()">
-    ${h.link_to(_('Style'), h.url('debug_style_home'))}
+    ${h.link_to(_('Style'), h.route_path('debug_style_home'))}
     &raquo;
     ${c.active}
 </%def>
diff --git a/rhodecode/templates/debug_style/buttons.html b/rhodecode/templates/debug_style/buttons.html
--- a/rhodecode/templates/debug_style/buttons.html
+++ b/rhodecode/templates/debug_style/buttons.html
@@ -2,7 +2,7 @@
 <%inherit file="/debug_style/index.html"/>
 
 <%def name="breadcrumbs_links()">
-    ${h.link_to(_('Style'), h.url('debug_style_home'))}
+    ${h.link_to(_('Style'), h.route_path('debug_style_home'))}
     &raquo;
     ${c.active}
 </%def>
diff --git a/rhodecode/templates/debug_style/code-block.html b/rhodecode/templates/debug_style/code-block.html
--- a/rhodecode/templates/debug_style/code-block.html
+++ b/rhodecode/templates/debug_style/code-block.html
@@ -3,7 +3,7 @@
 <%inherit file="/debug_style/index.html"/>
 
 <%def name="breadcrumbs_links()">
-    ${h.link_to(_('Style'), h.url('debug_style_home'))}
+    ${h.link_to(_('Style'), h.route_path('debug_style_home'))}
     &raquo;
     ${c.active}
 </%def>
diff --git a/rhodecode/templates/debug_style/collapsable-content.html b/rhodecode/templates/debug_style/collapsable-content.html
--- a/rhodecode/templates/debug_style/collapsable-content.html
+++ b/rhodecode/templates/debug_style/collapsable-content.html
@@ -2,7 +2,7 @@
 <%inherit file="/debug_style/index.html"/>
 
 <%def name="breadcrumbs_links()">
-    ${h.link_to(_('Style'), h.url('debug_style_home'))}
+    ${h.link_to(_('Style'), h.route_path('debug_style_home'))}
     &raquo;
     ${c.active}
 </%def>
diff --git a/rhodecode/templates/debug_style/form-elements-small.html b/rhodecode/templates/debug_style/form-elements-small.html
--- a/rhodecode/templates/debug_style/form-elements-small.html
+++ b/rhodecode/templates/debug_style/form-elements-small.html
@@ -2,7 +2,7 @@
 <%inherit file="/debug_style/index.html"/>
 
 <%def name="breadcrumbs_links()">
-    ${h.link_to(_('Style'), h.url('debug_style_home'))}
+    ${h.link_to(_('Style'), h.route_path('debug_style_home'))}
     &raquo;
     ${c.active}
 </%def>
diff --git a/rhodecode/templates/debug_style/form-elements.html b/rhodecode/templates/debug_style/form-elements.html
--- a/rhodecode/templates/debug_style/form-elements.html
+++ b/rhodecode/templates/debug_style/form-elements.html
@@ -2,7 +2,7 @@
 <%inherit file="/debug_style/index.html"/>
 
 <%def name="breadcrumbs_links()">
-    ${h.link_to(_('Style'), h.url('debug_style_home'))}
+    ${h.link_to(_('Style'), h.route_path('debug_style_home'))}
     &raquo;
     ${c.active}
 </%def>
diff --git a/rhodecode/templates/debug_style/form-inline.html b/rhodecode/templates/debug_style/form-inline.html
--- a/rhodecode/templates/debug_style/form-inline.html
+++ b/rhodecode/templates/debug_style/form-inline.html
@@ -2,7 +2,7 @@
 <%inherit file="/debug_style/index.html"/>
 
 <%def name="breadcrumbs_links()">
-    ${h.link_to(_('Style'), h.url('debug_style_home'))}
+    ${h.link_to(_('Style'), h.route_path('debug_style_home'))}
     &raquo;
     ${c.active}
 </%def>
diff --git a/rhodecode/templates/debug_style/form-vertical.html b/rhodecode/templates/debug_style/form-vertical.html
--- a/rhodecode/templates/debug_style/form-vertical.html
+++ b/rhodecode/templates/debug_style/form-vertical.html
@@ -2,7 +2,7 @@
 <%inherit file="/debug_style/index.html"/>
 
 <%def name="breadcrumbs_links()">
-    ${h.link_to(_('Style'), h.url('debug_style_home'))}
+    ${h.link_to(_('Style'), h.route_path('debug_style_home'))}
     &raquo;
     ${c.active}
 </%def>
diff --git a/rhodecode/templates/debug_style/forms.html b/rhodecode/templates/debug_style/forms.html
--- a/rhodecode/templates/debug_style/forms.html
+++ b/rhodecode/templates/debug_style/forms.html
@@ -2,7 +2,7 @@
 <%inherit file="/debug_style/index.html"/>
 
 <%def name="breadcrumbs_links()">
-    ${h.link_to(_('Style'), h.url('debug_style_home'))}
+    ${h.link_to(_('Style'), h.route_path('debug_style_home'))}
     &raquo;
     ${c.active}
 </%def>
diff --git a/rhodecode/templates/debug_style/icons.html b/rhodecode/templates/debug_style/icons.html
--- a/rhodecode/templates/debug_style/icons.html
+++ b/rhodecode/templates/debug_style/icons.html
@@ -2,7 +2,7 @@
 <%inherit file="/debug_style/index.html"/>
 
 <%def name="breadcrumbs_links()">
-    ${h.link_to(_('Style'), h.url('debug_style_home'))}
+    ${h.link_to(_('Style'), h.route_path('debug_style_home'))}
     &raquo;
     ${c.active}
 </%def>
diff --git a/rhodecode/templates/debug_style/index.html b/rhodecode/templates/debug_style/index.html
--- a/rhodecode/templates/debug_style/index.html
+++ b/rhodecode/templates/debug_style/index.html
@@ -51,29 +51,29 @@
 <%def name="sidebar()">
     <div class="sidebar">
       <ul class="nav nav-pills nav-stacked">
-          <li class="${'active' if c.active=='index' else ''}"><a href="${h.url('debug_style_home')}">${_('Index')}</a></li>
-          <li class="${'active' if c.active=='typography' else ''}"><a href="${h.url('debug_style_template', t_path='typography.html')}">${_('Typography')}</a></li>
-          <li class="${'active' if c.active=='forms' else ''}"><a href="${h.url('debug_style_template', t_path='forms.html')}">${_('Forms')}</a></li>
-          <li class="${'active' if c.active=='buttons' else ''}"><a href="${h.url('debug_style_template', t_path='buttons.html')}">${_('Buttons')}</a></li>
-          <li class="${'active' if c.active=='labels' else ''}"><a href="${h.url('debug_style_template', t_path='labels.html')}">${_('Labels')}</a></li>
-          <li class="${'active' if c.active=='alerts' else ''}"><a href="${h.url('debug_style_template', t_path='alerts.html')}">${_('Alerts')}</a></li>
-          <li class="${'active' if c.active=='tables' else ''}"><a href="${h.url('debug_style_template', t_path='tables.html')}">${_('Tables')}</a></li>
-          <li class="${'active' if c.active=='tables-wide' else ''}"><a href="${h.url('debug_style_template', t_path='tables-wide.html')}">${_('Tables wide')}</a></li>
-          <li class="${'active' if c.active=='collapsable-content' else ''}"><a href="${h.url('debug_style_template', t_path='collapsable-content.html')}">${_('Collapsable Content')}</a></li>
-          <li class="${'active' if c.active=='icons' else ''}"><a href="${h.url('debug_style_template', t_path='icons.html')}">${_('Icons')}</a></li>
-          <li class="${'active' if c.active=='layout-form-sidebar' else ''}"><a href="${h.url('debug_style_template', t_path='layout-form-sidebar.html')}">${_('Layout form with sidebar')}</a></li>
-          <li class="${'active' if c.active=='login' else ''}"><a href="${h.url('debug_style_template', t_path='login.html')}">${_('Login')}</a></li>
-          <li class="${'active' if c.active=='login2' else ''}"><a href="${h.url('debug_style_template', t_path='login2.html')}">${_('Login 2')}</a></li>
-          <li class="${'active' if c.active=='code-block' else ''}"><a href="${h.url('debug_style_template', t_path='code-block.html')}">${_('Code blocks')}</a></li>
+          <li class="${'active' if c.active=='index' else ''}"><a href="${h.route_path('debug_style_home')}">${_('Index')}</a></li>
+          <li class="${'active' if c.active=='typography' else ''}"><a href="${h.route_path('debug_style_template', t_path='typography.html')}">${_('Typography')}</a></li>
+          <li class="${'active' if c.active=='forms' else ''}"><a href="${h.route_path('debug_style_template', t_path='forms.html')}">${_('Forms')}</a></li>
+          <li class="${'active' if c.active=='buttons' else ''}"><a href="${h.route_path('debug_style_template', t_path='buttons.html')}">${_('Buttons')}</a></li>
+          <li class="${'active' if c.active=='labels' else ''}"><a href="${h.route_path('debug_style_template', t_path='labels.html')}">${_('Labels')}</a></li>
+          <li class="${'active' if c.active=='alerts' else ''}"><a href="${h.route_path('debug_style_template', t_path='alerts.html')}">${_('Alerts')}</a></li>
+          <li class="${'active' if c.active=='tables' else ''}"><a href="${h.route_path('debug_style_template', t_path='tables.html')}">${_('Tables')}</a></li>
+          <li class="${'active' if c.active=='tables-wide' else ''}"><a href="${h.route_path('debug_style_template', t_path='tables-wide.html')}">${_('Tables wide')}</a></li>
+          <li class="${'active' if c.active=='collapsable-content' else ''}"><a href="${h.route_path('debug_style_template', t_path='collapsable-content.html')}">${_('Collapsable Content')}</a></li>
+          <li class="${'active' if c.active=='icons' else ''}"><a href="${h.route_path('debug_style_template', t_path='icons.html')}">${_('Icons')}</a></li>
+          <li class="${'active' if c.active=='layout-form-sidebar' else ''}"><a href="${h.route_path('debug_style_template', t_path='layout-form-sidebar.html')}">${_('Layout form with sidebar')}</a></li>
+          <li class="${'active' if c.active=='login' else ''}"><a href="${h.route_path('debug_style_template', t_path='login.html')}">${_('Login')}</a></li>
+          <li class="${'active' if c.active=='login2' else ''}"><a href="${h.route_path('debug_style_template', t_path='login2.html')}">${_('Login 2')}</a></li>
+          <li class="${'active' if c.active=='code-block' else ''}"><a href="${h.route_path('debug_style_template', t_path='code-block.html')}">${_('Code blocks')}</a></li>
 
           <li class="divider"><strong>Experimental</strong></li>
-          <li class="${'active' if c.active=='panels' else ''}"><a href="${h.url('debug_style_template', t_path='panels.html')}">${_('Panels')}</a></li>
+          <li class="${'active' if c.active=='panels' else ''}"><a href="${h.route_path('debug_style_template', t_path='panels.html')}">${_('Panels')}</a></li>
 
           <li class="divider"><strong>Depreciated</strong></li>
-          <li class="${'active' if c.active=='form-elements' else ''}"><a href="${h.url('debug_style_template', t_path='form-elements.html')}">${_('Form elements')}</a></li>
-          <li class="${'active' if c.active=='form-elements-small' else ''}"><a href="${h.url('debug_style_template', t_path='form-elements-small.html')}">${_('Form elements small')}</a></li>
-          <li class="${'active' if c.active=='form-inline' else ''}"><a href="${h.url('debug_style_template', t_path='form-inline.html')}">${_('Form inline elements')}</a></li>
-          <li class="${'active' if c.active=='form-vertical' else ''}"><a href="${h.url('debug_style_template', t_path='form-vertical.html')}">${_('Form vertical')}</a></li>
+          <li class="${'active' if c.active=='form-elements' else ''}"><a href="${h.route_path('debug_style_template', t_path='form-elements.html')}">${_('Form elements')}</a></li>
+          <li class="${'active' if c.active=='form-elements-small' else ''}"><a href="${h.route_path('debug_style_template', t_path='form-elements-small.html')}">${_('Form elements small')}</a></li>
+          <li class="${'active' if c.active=='form-inline' else ''}"><a href="${h.route_path('debug_style_template', t_path='form-inline.html')}">${_('Form inline elements')}</a></li>
+          <li class="${'active' if c.active=='form-vertical' else ''}"><a href="${h.route_path('debug_style_template', t_path='form-vertical.html')}">${_('Form vertical')}</a></li>
         </ul>
     </div>
 </%def>
\ No newline at end of file
diff --git a/rhodecode/templates/debug_style/labels.html b/rhodecode/templates/debug_style/labels.html
--- a/rhodecode/templates/debug_style/labels.html
+++ b/rhodecode/templates/debug_style/labels.html
@@ -2,7 +2,7 @@
 <%inherit file="/debug_style/index.html"/>
 
 <%def name="breadcrumbs_links()">
-    ${h.link_to(_('Style'), h.url('debug_style_home'))}
+    ${h.link_to(_('Style'), h.route_path('debug_style_home'))}
     &raquo;
     ${c.active}
 </%def>
diff --git a/rhodecode/templates/debug_style/layout-form-sidebar.html b/rhodecode/templates/debug_style/layout-form-sidebar.html
--- a/rhodecode/templates/debug_style/layout-form-sidebar.html
+++ b/rhodecode/templates/debug_style/layout-form-sidebar.html
@@ -2,7 +2,7 @@
 <%inherit file="/debug_style/index.html"/>
 
 <%def name="breadcrumbs_links()">
-    ${h.link_to(_('Style'), h.url('debug_style_home'))}
+    ${h.link_to(_('Style'), h.route_path('debug_style_home'))}
     &raquo;
     ${c.active}
 </%def>
diff --git a/rhodecode/templates/debug_style/login.html b/rhodecode/templates/debug_style/login.html
--- a/rhodecode/templates/debug_style/login.html
+++ b/rhodecode/templates/debug_style/login.html
@@ -3,7 +3,7 @@
 
 
 <%def name="breadcrumbs_links()">
-    ${h.link_to(_('Style'), h.url('debug_style_home'))}
+    ${h.link_to(_('Style'), h.route_path('debug_style_home'))}
     &raquo;
     ${c.active}
 </%def>
diff --git a/rhodecode/templates/debug_style/panels.html b/rhodecode/templates/debug_style/panels.html
--- a/rhodecode/templates/debug_style/panels.html
+++ b/rhodecode/templates/debug_style/panels.html
@@ -2,7 +2,7 @@
 <%inherit file="/debug_style/index.html"/>
 
 <%def name="breadcrumbs_links()">
-    ${h.link_to(_('Style'), h.url('debug_style_home'))}
+    ${h.link_to(_('Style'), h.route_path('debug_style_home'))}
     &raquo;
     ${c.active}
 </%def>
diff --git a/rhodecode/templates/debug_style/tables-wide.html b/rhodecode/templates/debug_style/tables-wide.html
--- a/rhodecode/templates/debug_style/tables-wide.html
+++ b/rhodecode/templates/debug_style/tables-wide.html
@@ -2,7 +2,7 @@
 <%inherit file="/debug_style/index.html"/>
 
 <%def name="breadcrumbs_links()">
-    ${h.link_to(_('Style'), h.url('debug_style_home'))}
+    ${h.link_to(_('Style'), h.route_path('debug_style_home'))}
     &raquo;
     ${c.active}
 </%def>
diff --git a/rhodecode/templates/debug_style/tables.html b/rhodecode/templates/debug_style/tables.html
--- a/rhodecode/templates/debug_style/tables.html
+++ b/rhodecode/templates/debug_style/tables.html
@@ -2,7 +2,7 @@
 <%inherit file="/debug_style/index.html"/>
 
 <%def name="breadcrumbs_links()">
-    ${h.link_to(_('Style'), h.url('debug_style_home'))}
+    ${h.link_to(_('Style'), h.route_path('debug_style_home'))}
     &raquo;
     ${c.active}
 </%def>
diff --git a/rhodecode/templates/debug_style/typography.html b/rhodecode/templates/debug_style/typography.html
--- a/rhodecode/templates/debug_style/typography.html
+++ b/rhodecode/templates/debug_style/typography.html
@@ -2,7 +2,7 @@
 <%inherit file="/debug_style/index.html"/>
 
 <%def name="breadcrumbs_links()">
-    ${h.link_to(_('Style'), h.url('debug_style_home'))}
+    ${h.link_to(_('Style'), h.route_path('debug_style_home'))}
     &raquo;
     ${c.active}
 </%def>