diff --git a/docs/components/navs.md b/docs/components/navs.md
index 3552b9125827..f007635ab394 100644
--- a/docs/components/navs.md
+++ b/docs/components/navs.md
@@ -142,6 +142,30 @@ Just add `.nav-stacked` to the `.nav.nav-pills`.
 </ul>
 {% endexample %}
 
+## Justified navs
+
+Just add `.nav-justified` to the `.nav.nav-tabs` or `.nav.nav-pills`. Easily make tabs or pills equal widths of their parent at screens wider than 768px with `.nav-justified`. On smaller screens, the nav links are stacked. Justified navbar nav links are currently not supported.
+
+### Safari and responsive justified navs
+As of v8.0, Safari exhibits a bug in which resizing your browser horizontally causes rendering errors in the justified nav that are cleared upon refreshing. This bug is also shown in the [justified nav example](../examples/justified-nav/).
+
+{% example html %}
+<ul class="nav nav-tabs nav-justified">
+  <li class="nav-item">
+    <a class="nav-link active" href="#">Active</a>
+  </li>
+  <li class="nav-item">
+    <a class="nav-link" href="#">Link</a>
+  </li>
+  <li class="nav-item">
+    <a class="nav-link" href="#">Another link</a>
+  </li>
+  <li class="nav-item">
+    <a class="nav-link disabled" href="#">Disabled</a>
+  </li>
+</ul>
+{% endexample %}
+
 ## Using dropdowns
 
 Add dropdown menus with a little extra HTML and the [dropdowns JavaScript plugin]({{ site.baseurl }}/components/dropdowns/#usage).
diff --git a/scss/_mixins.scss b/scss/_mixins.scss
index 934769fdcdd0..630cfb9209ec 100644
--- a/scss/_mixins.scss
+++ b/scss/_mixins.scss
@@ -36,6 +36,7 @@
 @import "mixins/pagination";
 @import "mixins/lists";
 @import "mixins/list-group";
+@import "mixins/nav";
 @import "mixins/nav-divider";
 @import "mixins/forms";
 @import "mixins/progress";
diff --git a/scss/_nav.scss b/scss/_nav.scss
index 4efed45b6228..fbddf31223ad 100644
--- a/scss/_nav.scss
+++ b/scss/_nav.scss
@@ -149,6 +149,14 @@
   }
 }
 
+//
+// Justified
+//
+
+.nav-justified {
+  @include nav-justified;
+  @include nav-tabs-justified;
+}
 
 //
 // Dropdowns
diff --git a/scss/_variables.scss b/scss/_variables.scss
index 88afa3ccd329..5957257e1d58 100644
--- a/scss/_variables.scss
+++ b/scss/_variables.scss
@@ -399,6 +399,9 @@ $nav-tabs-active-link-hover-color:          $gray !default;
 $nav-tabs-active-link-hover-border-color:   #ddd !default;
 
 $nav-tabs-justified-link-border-color:            #ddd !default;
+$nav-tabs-justified-link-border-radius:           $border-radius !default;
+$nav-tabs-justified-link-border-width:            $border-width !default;
+$nav-tabs-justified-link-margin-bottom:           5px !default;
 $nav-tabs-justified-active-link-border-color:     $body-bg !default;
 
 $nav-pills-border-radius:                   $border-radius !default;
diff --git a/scss/mixins/_nav.scss b/scss/mixins/_nav.scss
new file mode 100644
index 000000000000..24ef04f8bd08
--- /dev/null
+++ b/scss/mixins/_nav.scss
@@ -0,0 +1,62 @@
+// Justified nav links
+// -------------------------
+
+@mixin nav-justified {
+  width: 100%;
+
+  .nav-item {
+    float: none;
+  }
+
+  .nav-link {
+    margin-bottom: $nav-tabs-justified-link-margin-bottom;
+    text-align: center;
+  }
+
+  .dropdown .dropdown-menu {
+    top: auto;
+    left: auto;
+  }
+
+  @include media-breakpoint-up(md) {
+    .nav-item {
+      display: table-cell;
+      width: 1%;
+    }
+    .nav-link {
+      margin-bottom: 0;
+    }
+  }
+}
+
+// Move borders to anchors instead of bottom of list
+//
+// Mixin for adding on top the shared `.nav-justified` styles for our tabs
+@mixin nav-tabs-justified {
+  border-bottom: 0;
+
+  .nav-link { // Override margin from .nav-tabs
+    margin-right: 0;
+    @include border-radius($nav-tabs-justified-link-border-radius);
+  }
+
+  .nav-link.active {
+    @include plain-hover-focus {
+      border: $nav-tabs-justified-link-border-width solid $nav-tabs-justified-link-border-color;
+    }
+  }
+
+  @include media-breakpoint-up(md) {
+    .nav-link,
+    .nav-link.disabled,
+    .nav-link.disabled:hover {
+      border-bottom: $nav-tabs-justified-link-border-width solid $nav-tabs-justified-link-border-color;
+      @include border-top-radius($nav-tabs-justified-link-border-radius);
+    }
+    .nav-link.active {
+      @include plain-hover-focus {
+        border-bottom-color: $nav-tabs-justified-active-link-border-color;
+      }
+    }
+  }
+}