SolvedSemantic UI React Icons are not displaying (fonts not loading in CRA)

Steps

Trying to use <Icon name="search" />, but no icons are displaying.
https://codesandbox.io/s/8nzy51pk49

Expected Result

Icon should be displaying.

Actual Result

Icon are rendered as box.

Version

"semantic-ui-react": "^0.79.1"
"semantic-ui-css": "^2.3.1",

Testcase

created a codesandbox project here: https://codesandbox.io/s/8nzy51pk49

15 Answers

✔️Accepted Answer

@levithomason I had done a silly mistake. I tried to reproduce the issue by creating a basic project with CRA that just displays the Icon. It worked though.
So I checked my project thoroughly. What I did was, in order to replace the default font with Open Sans, I had used in my css:

* {
font-family: 'Open Sans';
}

:)

Other Answers:

Thanks for the report.

Also, codesandbox seems to have an issue with their loaders for resolving fonts in CSS files. If you use an "external" dependency and add CSS sheet via a CDN it works:

Here's the original codesandbox updated to use a CDN which also now works:

https://codesandbox.io/s/mzq3lvq7jj

More Issues: