CODEWITHSUNDEEP
javascripthtmlcssreactjstailwind-css
Niklas
Niklas

Reputation: 131

React and Tailwind Custom Fonts from ttf file

Hey i want to add some custom fonts from files.

These are the font files that i want to load.

These are the font files

My index.css

body {
  margin: 0;
  padding: 0;
}

@import url("https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500&display=swap");

@tailwind base;
@tailwind components;

@tailwind utilities;

Thanks in advance

Upvotes: 1

Views: 1238

Answers (1)

Goose
Goose

Reputation: 48

If you don't mind spending time getting the relative path to each of the fonts, you can do this

/* local if the font is installed */
@font-face {
    font-family: 'Font Name';
    src: local('Font Name'), url("./FontName.ttf") format('truetype');
}

Upvotes: 1

Related Questions