diff --git a/actionpack/lib/action_dispatch/routing/inspector.rb b/actionpack/lib/action_dispatch/routing/inspector.rb
index 8d7461ecc3f93..63d394be7524a 100644
--- a/actionpack/lib/action_dispatch/routing/inspector.rb
+++ b/actionpack/lib/action_dispatch/routing/inspector.rb
@@ -67,15 +67,19 @@ def initialize
         @engines = Hash.new
       end
 
-      def format(all_routes, filter = nil)
+      def format(all_routes, filter = nil, format = :txt)
         if filter
           all_routes = all_routes.select{ |route| route.defaults[:controller] == filter }
         end
 
         routes = collect_routes(all_routes)
 
-        formatted_routes(routes) +
-          formatted_routes_for_engines
+        routes = formatted_routes(routes, format) + formatted_routes_for_engines(format)
+        if format == :html
+          routes.join('')
+        else
+          routes
+        end
       end
 
       def collect_routes(routes)
@@ -101,19 +105,32 @@ def collect_engine_routes(route)
         end
       end
 
-      def formatted_routes_for_engines
+      def formatted_routes_for_engines(format)
         @engines.map do |name, routes|
-          ["\nRoutes for #{name}:"] + formatted_routes(routes)
+          ["\nRoutes for #{name}:"] + formatted_routes(routes, format)
         end.flatten
       end
 
-      def formatted_routes(routes)
+      def formatted_routes(routes, format)
         name_width = routes.map{ |r| r[:name].length }.max
         verb_width = routes.map{ |r| r[:verb].length }.max
         path_width = routes.map{ |r| r[:path].length }.max
 
         routes.map do |r|
-          "#{r[:name].rjust(name_width)} #{r[:verb].ljust(verb_width)} #{r[:path].ljust(path_width)} #{r[:reqs]}"
+          if format == :txt
+            "#{r[:name].rjust(name_width)} " +
+            "#{r[:verb].ljust(verb_width)} " +
+            "#{r[:path].ljust(path_width)} " +
+            "#{r[:reqs]}"
+          elsif format == :html
+            route = r
+            "<tr class='route-row' data-helper='path' #{[:name, :verb, :path, :reqs].each {|key| "data-#{key}='#{route[key]}'"} } >" +
+              "<td class='route-name'>#{route[:name] + "<span class='helper'>_path</span>" if route[:name].present?}</td>" +
+              "<td class='route-verb'>#{route[:verb]}</td>" +
+              "<td class='route-path'>#{route[:path]}</td>" +
+              "<td class='route-reqs'>#{route[:reqs]}</td>" +
+            "</tr>"
+          end
         end
       end
     end
diff --git a/railties/lib/rails/info_controller.rb b/railties/lib/rails/info_controller.rb
index fe1e25d88c04f..8ffb56a522767 100644
--- a/railties/lib/rails/info_controller.rb
+++ b/railties/lib/rails/info_controller.rb
@@ -16,7 +16,7 @@ def properties
 
   def routes
     inspector = ActionDispatch::Routing::RoutesInspector.new
-    @info     = inspector.format(_routes.routes).join("\n")
+    @info     = inspector.format(_routes.routes, nil, :html)
   end
 
   protected
diff --git a/railties/lib/rails/templates/rails/info/routes.html.erb b/railties/lib/rails/templates/rails/info/routes.html.erb
index 890f6f5b03c5c..8a7e4d37a06d6 100644
--- a/railties/lib/rails/templates/rails/info/routes.html.erb
+++ b/railties/lib/rails/templates/rails/info/routes.html.erb
@@ -1,3 +1,7 @@
+<style>
+.route-row td {padding: 0 30px;}
+.routeTable   {margin:  0 auto 0;}
+</style>
 <h2>
   Routes
 </h2>
@@ -6,4 +10,25 @@
   Routes match in priority from top to bottom
 </p>
 
-<p><pre><%= @info %></pre></p>
\ No newline at end of file
+<table id='routeTable' class='routeTable'>
+  <th>Helper<br />
+    <%= link_to "Path", "#", 'data-route-helper' => 'path',
+                              title: "Returns a relative path (without the http or domain)" %> /
+    <%= link_to "Url", "#", 'data-route-helper' => 'url',
+                              title: "Returns an absolute url (with the http and domain)" %>
+  </th>
+  <th>HTTP Verb</th>
+  <th>Path</th>
+  <th>Controller#Action</th>
+  <%= @info.html_safe %>
+</table>
+
+<script type='text/javascript'>
+  $(document).ready(function (){
+    $("#routeTable [data-route-helper]").on('click', function(){
+      routeHelper = $(this).data("route-helper");
+      $('.route-name span.helper').html("_" + routeHelper);
+      return false;
+    })
+  })
+</script>
\ No newline at end of file