How to Add and Use Adobe Fonts in Wix: A Guide for Wix and Wix Studio

Adobe typekit fonts can be used by adding it to a web project in abode and then importing it through some code and mainly CSS.

If you are using classic editor, add this in the custom code and in the head section

<link rel="stylesheet" href="https://use.typekit.net/xxxxx.css">
<style>

h1, h2, h3, h4,h5,h6, p, span, li {
  font-family: "new-rubrik-edge", sans-serif !important;
  font-weight: 400 !important;
  font-style: normal !important;
}

</style>

If you are using studio, head into the global css section and then add the code as below

@import url(“https://use.typekit.net/xxxx.css”)

.richtext__text {
font-family: "new-rubrik-edge", sans-serif !important;
  font-weight: 400 !important;
  font-style: normal !important
}
  • replace xxxx with your webproject id.
  • you would have to replace the type of font that you put in your web project. example is just of rubrik font
  • for classic editor, the changes cannot be applied to individual elements although it could be tried. It is a bit more restrictive and a lot more code would be required.
  • in studio, changes can be applied to individual elements using custom classes
  • In studio editor, you would be able to see the changes immediately in the preview but for classic, you would have to check the live site which is a bit time consuming.

Have fun!