diff --git a/client/src/document/molecules/_notecards.scss b/client/src/document/molecules/_notecards.scss
deleted file mode 100644
index d9f817651550..000000000000
--- a/client/src/document/molecules/_notecards.scss
+++ /dev/null
@@ -1,157 +0,0 @@
-@use "sass:math";
-
-@mixin set-notecard-icon($icon) {
-  h3,
-  h4,
-  &.inline {
-    &::before {
-      background: transparent url($icon) 0 0 no-repeat;
-    }
-  }
-}
-
-@mixin set-notecard-icon-only($icon) {
-  h3,
-  h4 {
-    &::before {
-      background-image: url($icon);
-    }
-  }
-}
-
-.notecard {
-  border-left: 1rem solid $mdn-blue600;
-  margin: 0;
-  margin-bottom: 1rem;
-  padding: 0.5rem;
-
-  a {
-    &:link,
-    &:visited {
-      color: $mdn-color-neutral-90;
-      text-decoration: underline;
-    }
-
-    &:hover,
-    &:focus {
-      text-decoration: none;
-    }
-  }
-
-  h3,
-  h4 {
-    /*
-     * Because we also allow h3, we need to undo some of its styling here.
-     * This relates specifically to `background-color`, `color`,
-     * `padding` and `font-weight`
-     */
-    background-color: inherit;
-    color: inherit;
-    display: inline-block;
-    font-family: $site-font-family;
-    font-size: 1rem;
-    font-weight: var(--font-body-strong-weight);
-    margin: 0;
-    margin-bottom: 0.25rem;
-    padding: 0;
-
-    @media screen and (max-width: $screen-sm) {
-      font-size: 1rem;
-    }
-  }
-
-  h3,
-  h4,
-  &.inline {
-    &::before {
-      background-repeat: no-repeat;
-      background-size: 18px;
-      content: "";
-      display: inline-block;
-      height: 21px;
-      margin-right: 0.25rem;
-      position: relative;
-      top: 2px;
-      width: 20px;
-    }
-  }
-
-  p {
-    margin-bottom: 0.25rem;
-
-    &:last-child {
-      margin-bottom: 0;
-    }
-  }
-
-  &.inline {
-    font-weight: normal;
-    margin: 0.25rem;
-    padding: 0.125rem 0.25rem;
-
-    &::before {
-      top: 5px;
-    }
-
-    p {
-      display: inline-block;
-      margin-bottom: 0;
-    }
-  }
-
-  &.neutral {
-    @include set-notecard-icon("~@mdn/dinocons/general/globe.svg");
-
-    background-color: $mdn-blue100;
-    color: $mdn-blue700;
-  }
-
-  &.success {
-    @include set-notecard-icon("~@mdn/dinocons/general/check-mark.svg");
-
-    background-color: $mdn-green100;
-    border-color: $mdn-green600;
-    color: $mdn-color-neutral-90;
-  }
-
-  &.note {
-    @include set-notecard-icon("~@mdn/dinocons/file-icons/file.svg");
-
-    background-color: $mdn-blue100;
-  }
-
-  &.warning,
-  &.experimental,
-  &.draft,
-  &.secure {
-    @include set-notecard-icon(
-      "~@mdn/dinocons/notifications/exclamation-triangle.svg"
-    );
-
-    background-color: $mdn-color-yellow-10;
-    border-color: $mdn-yellow300;
-    color: $mdn-color-neutral-90;
-  }
-
-  &.experimental {
-    @include set-notecard-icon-only("~@mdn/dinocons/general/flask.svg");
-  }
-
-  &.draft {
-    @include set-notecard-icon-only("~@mdn/dinocons/general/pencil.svg");
-  }
-
-  &.secure {
-    @include set-notecard-icon-only("~@mdn/dinocons/general/lock.svg");
-  }
-
-  &.negative,
-  &.obsolete,
-  &.deprecated {
-    @include set-notecard-icon("~@mdn/dinocons/general/trash.svg");
-
-    background-color: $mdn-red200;
-    border-color: $mdn-red300;
-    color: $mdn-color-neutral-90;
-  }
-}