diff --git a/packages/css-theme/src/_fonts.scss b/packages/css-theme/src/_fonts.scss
new file mode 100644
index 00000000000..e423aed3694
--- /dev/null
+++ b/packages/css-theme/src/_fonts.scss
@@ -0,0 +1,10 @@
+@import "~@fontsource/ubuntu/400.css";
+@import "~@fontsource/ubuntu/500.css";
+@import "~@fontsource/ubuntu/700.css";
+@import "~@fontsource/ubuntu/400-italic.css";
+@import "~@fontsource/ubuntu/500-italic.css";
+@import "~@fontsource/roboto-mono/400.css";
+@import "~@fontsource/roboto-mono/600.css";
+@import "~@fontsource/roboto-mono/400-italic.css";
+@import "~@fontsource/permanent-marker/index.css";
+
diff --git a/packages/css-theme/src/_reset.scss b/packages/css-theme/src/_reset.scss
index fa38f0ad45f..a1463b5ef86 100644
--- a/packages/css-theme/src/_reset.scss
+++ b/packages/css-theme/src/_reset.scss
@@ -4,7 +4,7 @@ body {
   line-height: 1.5;
   scroll-behavior: smooth;
   font-family: Ubuntu;
-  font-weight: 300;
+  font-weight: 400;
 }
 img {
   max-width: 100%;
diff --git a/packages/css-theme/src/_utility.scss b/packages/css-theme/src/_utility.scss
index 10c65039b5d..b65cd9710ef 100644
--- a/packages/css-theme/src/_utility.scss
+++ b/packages/css-theme/src/_utility.scss
@@ -48,33 +48,15 @@
   font-family: 'Permanent marker';
   color: $oc-pink-5;
 }
-.fw-100 {
-  font-weight: 100;
-}
-.fw-200 {
-  font-weight: 200;
-}
-.fw-300 {
-  font-weight: 300;
-}
 .fw-400 {
   font-weight: 400;
 }
 .fw-500 {
   font-weight: 500;
 }
-.fw-600 {
-  font-weight: 600;
-}
 .fw-700 {
   font-weight: 700;
 }
-.fw-800 {
-  font-weight: 800;
-}
-.fw-900 {
-  font-weight: 900;
-}
 
 ul.inline {
   list-style-type: none;
diff --git a/packages/css-theme/src/components/_draft-configurator.scss b/packages/css-theme/src/components/_draft-configurator.scss
index f54bd84f0dd..6f5969dd2ae 100644
--- a/packages/css-theme/src/components/_draft-configurator.scss
+++ b/packages/css-theme/src/components/_draft-configurator.scss
@@ -49,7 +49,7 @@ ul#draft-config {
   }
   ul.config.level-1 > li {
     font-size: 1.25rem;
-    font-weight: normal;
+    font-weight: 400;
     > div {
       padding: 0.2rem 0.5rem 0.1rem 0.5rem;
     }
@@ -73,7 +73,7 @@ ul#draft-config {
   }
   ul.config.level-2 > li {
     font-size: 1.15rem;
-    font-weight: normal;
+    font-weight: 400;
     > span,
     > div:first-of-type {
       padding: 0.3rem 0.5rem 0.2rem 2rem;
@@ -106,7 +106,7 @@ ul#draft-config {
   }
   ul.config.level-3 > li {
     font-size: 1.1rem;
-    font-weight: normal;
+    font-weight: 400;
     > div:first-of-type {
       padding: 0.3rem 0.5rem 0.2rem 3rem;
       line-height: 1.2;
diff --git a/packages/css-theme/src/components/_draft.scss b/packages/css-theme/src/components/_draft.scss
index 09e5d1861a4..ca11059bd81 100644
--- a/packages/css-theme/src/components/_draft.scss
+++ b/packages/css-theme/src/components/_draft.scss
@@ -59,7 +59,7 @@ svg.freesewing.draft {
     font-size: 6px;
     @include title-font;
     text-anchor: start;
-    font-weight: 200;
+    font-weight: 400;
     dominant-baseline: ideographic;
   }
   .text-xs {
@@ -93,7 +93,7 @@ svg.freesewing.draft {
   text.title-nr {
     font-size: 32px;
     @include title-font;
-    font-weight: bold;
+    font-weight: 700;
     stroke: none;
   }
   /* New style for sampled sizes */
diff --git a/packages/css-theme/src/components/_main-menu.scss b/packages/css-theme/src/components/_main-menu.scss
index 6b489712b41..f5ee1d22cb7 100644
--- a/packages/css-theme/src/components/_main-menu.scss
+++ b/packages/css-theme/src/components/_main-menu.scss
@@ -34,7 +34,7 @@ ul#main-menu {
   ul {
     margin: 0;
     padding: 0;
-    font-weight: normal;
+    font-weight: 400;
     text-transform: none;
   }
   ul[class^='level-'] {
@@ -42,7 +42,7 @@ ul#main-menu {
       line-height: 1.5;
       > a {
         padding: 0;
-        font-weight: 300;
+        font-weight: 400;
         text-transform: none;
       }
       > a:before {
diff --git a/packages/css-theme/src/theme.scss b/packages/css-theme/src/theme.scss
index 4ee1effd9b7..32f63b3a283 100644
--- a/packages/css-theme/src/theme.scss
+++ b/packages/css-theme/src/theme.scss
@@ -2,6 +2,7 @@
 @import '../../../node_modules/open-color/open-color.scss';
 @import 'variables';
 @import 'mixins';
+@import 'fonts';
 @import 'prism';
 @import 'theme-wrapper';
 @import 'typography';