# loadFont is not working
**URL:** https://discourse.processing.org/t/loadfont-is-not-working/10146
**Category:** Libraries
**Created:** [April 9, 2019, 7:52pm UTC](https://discourse.processing.org/t/loadfont-is-not-working/10146 "2019-04-09T19:52:59Z")
**Posts on this page:** 10
**Page:** 1
### Author:  [@baisampayans](https://discourse.processing.org/u/baisampayans)
#### Post date: [April 9, 2019, 7:52pm UTC](https://discourse.processing.org/t/loadfont-is-not-working/10146/1 "2019-04-09T19:52:59Z")
Hi All,
I am using react-p5-wrapper npm module to use p5 sketches inside my react based portfolio site.
While it works pretty fine, I got stuck in loadFonts.
As per the example and documentation, in preload function loadFonts(‘your\_font\_name.ttf/otf’) should work. But it is always giving me errors. It is saying problem loading the font and unsupported OpenType signature.
I tried to console.log the font inside the preload function and since it is not loading, it is coming as undefined.
Attaching the screenshot of the error.
Any help to resolve this issue would be highly appreciated.
Best,
Baisam
---
### Author:  [@baisampayans](https://discourse.processing.org/u/baisampayans)
#### Post date: [April 9, 2019, 7:53pm UTC](https://discourse.processing.org/t/loadfont-is-not-working/10146/2 "2019-04-09T19:53:44Z")
Attaching the code screenshot also.
---
### Author:  [@kll](https://discourse.processing.org/u/kll)
#### Post date: [April 10, 2019, 10:01am UTC](https://discourse.processing.org/t/loadfont-is-not-working/10146/3 "2019-04-10T10:01:56Z")
it might be a path problem,
where is that file?
usually i do like
var fontfile = “data/knewave.otf”;
…loadFont(fontfile);
---
### Author:  [@baisampayans](https://discourse.processing.org/u/baisampayans)
#### Post date: [April 11, 2019, 3:22am UTC](https://discourse.processing.org/t/loadfont-is-not-working/10146/4 "2019-04-11T03:22:48Z")
the file is in the same folder as the sketch
---
### Author:  [@kll](https://discourse.processing.org/u/kll)
#### Post date: [April 11, 2019, 3:25am UTC](https://discourse.processing.org/t/loadfont-is-not-working/10146/5 "2019-04-11T03:25:35Z")
and did you try
```auto
var fontfile = "knewave.otf";
```
instead “./” already?
---
### Author:  [@baisampayans](https://discourse.processing.org/u/baisampayans)
#### Post date: [April 11, 2019, 3:27am UTC](https://discourse.processing.org/t/loadfont-is-not-working/10146/6 "2019-04-11T03:27:30Z")
yes i tried and i guess you can have it both ways.
---
### Author:  [@kll](https://discourse.processing.org/u/kll)
#### Post date: [April 11, 2019, 3:34am UTC](https://discourse.processing.org/t/loadfont-is-not-working/10146/7 "2019-04-11T03:34:11Z")
here [https://editor.p5js.org/kll/sketches/5eAJTcNGR](https://editor.p5js.org/kll/sketches/5eAJTcNGR) it works.
---
### Author:  [@baisampayans](https://discourse.processing.org/u/baisampayans)
#### Post date: [April 12, 2019, 7:39am UTC](https://discourse.processing.org/t/loadfont-is-not-working/10146/8 "2019-04-12T07:39:45Z")
It works in the editor but not when I am using VSCode as the editor.
One hack that I figured out is that, if the font file is in the public folder of react project, it works fine, which is strange.
---
### Author:  [@janglee](https://discourse.processing.org/u/janglee)
#### Post date: [April 22, 2019, 3:13pm UTC](https://discourse.processing.org/t/loadfont-is-not-working/10146/9 "2019-04-22T15:13:43Z")
> [@baisampayans](#):
>
> One hack that I figured out is that, if the font file is in the public folder of react project, it works fine, which is strange.
If you created your project with `react-create-app` then you should have to put your assets in `public/` directory. Read [wiki](https://facebook.github.io/create-react-app/docs/using-the-public-folder)
---
### Author:  [@JustSimple](https://discourse.processing.org/u/JustSimple)
#### Post date: [May 29, 2019, 10:17am UTC](https://discourse.processing.org/t/loadfont-is-not-working/10146/10 "2019-05-29T10:17:59Z")
Having the same problem, except instead of \