diff --git a/app/views/projects/protected_tags/_create_protected_tag.html.haml b/app/views/projects/protected_tags/_create_protected_tag.html.haml
new file mode 100644
index 00000000000..6ffe7b4c24f
--- /dev/null
+++ b/app/views/projects/protected_tags/_create_protected_tag.html.haml
@@ -0,0 +1,32 @@
+= form_for [@project.namespace.becomes(Namespace), @project, @protected_branch] do |f|
+  .panel.panel-default
+    .panel-heading
+      %h3.panel-title
+        Protect a tag
+    .panel-body
+      .form-horizontal
+        = form_errors(@protected_branch)
+        .form-group
+          = f.label :name, class: 'col-md-2 text-right' do
+            Tag:
+          .col-md-10
+            = render partial: "projects/protected_tags/dropdown", locals: { f: f }
+            .help-block
+              = link_to 'Wildcards', help_page_path('user/project/protected_branches', anchor: 'wildcard-protected-branches')
+              such as
+              %code *-stable
+              or
+              %code production/*
+              are supported
+        .form-group
+          %label.col-md-2.text-right{ for: 'push_access_levels_attributes' }
+            Allowed to push:
+          .col-md-10
+            .push_access_levels-container
+              = dropdown_tag('Select',
+                             options: { toggle_class: 'js-allowed-to-push wide',
+                             dropdown_class: 'dropdown-menu-selectable',
+                             data: { field_name: 'protected_branch[push_access_levels_attributes][0][access_level]', input_id: 'push_access_levels_attributes' }})
+
+    .panel-footer
+      = f.submit 'Protect', class: 'btn-create btn', disabled: true
diff --git a/app/views/projects/protected_tags/_dropdown.html.haml b/app/views/projects/protected_tags/_dropdown.html.haml
new file mode 100644
index 00000000000..3da153bc521
--- /dev/null
+++ b/app/views/projects/protected_tags/_dropdown.html.haml
@@ -0,0 +1,15 @@
+= f.hidden_field(:name)
+
+= dropdown_tag('Select tag or create wildcard',
+               options: { toggle_class: 'js-protected-tag-select js-filter-submit wide',
+                          filter: true, dropdown_class: "dropdown-menu-selectable", placeholder: "Search protected tag",
+                          footer_content: true,
+                          data: { show_no: true, show_any: true, show_upcoming: true,
+                                  selected: params[:protected_branch_name],
+                                  project_id: @project.try(:id) } }) do
+
+  %ul.dropdown-footer-list
+    %li
+      = link_to '#', title: "New Protected Tag", class: "create-new-protected-tag" do
+        Create wildcard
+        %code
diff --git a/app/views/projects/protected_tags/_index.html.haml b/app/views/projects/protected_tags/_index.html.haml
new file mode 100644
index 00000000000..3a1da1202e9
--- /dev/null
+++ b/app/views/projects/protected_tags/_index.html.haml
@@ -0,0 +1,18 @@
+- content_for :page_specific_javascripts do
+  = page_specific_javascript_bundle_tag('protected_branches')
+
+.row.prepend-top-default.append-bottom-default
+  .col-lg-3
+    %h4.prepend-top-0
+      Protected tags
+    %p.prepend-top-20
+      By default, Protected branches are designed to:
+      %ul
+        %li Prevent tag pushes from everybody except Masters
+        %li Prevent <strong>anyone</strong> from force pushing to the tag
+        %li Prevent <strong>anyone</strong> from deleting the tag
+  .col-lg-9
+    - if can? current_user, :admin_project, @project
+      = render 'projects/protected_tags/create_protected_tag'
+
+    = render "projects/protected_tags/tags_list"
diff --git a/app/views/projects/protected_tags/_tags_list.html.haml b/app/views/projects/protected_tags/_tags_list.html.haml
new file mode 100644
index 00000000000..e7ce90393e9
--- /dev/null
+++ b/app/views/projects/protected_tags/_tags_list.html.haml
@@ -0,0 +1,6 @@
+.panel.panel-default.protected-tags-list
+  .panel-heading
+    %h3.panel-title
+      Protected tag (0)
+  %p.settings-message.text-center
+    There are currently no protected tags, protect a tag with the form above.