Which file do I install?
A font download usually contains several versions of the same typeface. Only one of them is meant for your computer or phone:
- .ttf and .otf are desktop fonts. Install these on Windows, macOS, iPhone, iPad and Android.
- .woff and .woff2 are web fonts. They are compressed for websites and are not meant to be installed. Use them in CSS with
@font-face. - .eot and .svg are legacy web formats for very old browsers. You can ignore them.
If the download has only one file, it will be a .ttf or .otf and you can install it directly.
Install on Windows
- Download the font .zip and right-click it, then choose Extract All.
- Open the extracted folder and find the .ttf or .otf files.
- Right-click each font file and choose Install (or Install for all users).
- Restart Word, Photoshop or any open app to see the font.
Install on macOS
- Download the .zip and double-click it to unzip.
- Double-click a font file to open it in Font Book.
- Click Install Font.
- Restart any open apps to use the font.
Install on iPhone & iPad
- Install a font manager app that supports custom fonts from the App Store.
- Download and unzip the font in the Files app.
- Open the font files with the font manager and follow its install prompt.
- Approve the profile in Settings if asked; the font appears in supported apps.
Install on Android
- Download and unzip the font with your Files app.
- Apps such as document editors and design apps let you import a .ttf from storage.
- In the app, open its font settings and choose Add font.
- Select the downloaded font file to start using it.
Using a Gurmukhi font on a website
Websites do not use the installed fonts on the visitor's device. Instead, upload the .woff2 file to your server and declare it in CSS:
@font-face {
font-family: 'Riyasti Naveen';
src: url('/fonts/riyasti-naveen.woff2') format('woff2');
font-display: swap;
}
body { font-family: 'Riyasti Naveen', 'Noto Sans Gurmukhi', sans-serif; }
Always list a Unicode fallback such as Noto Sans Gurmukhi after your custom font, so text still shows while the file loads.
Why does my text still look like English?
Tat Khalsa's fonts (Riyasti Hathlikhat, Puratan Hathlikhat Sampuran and Riyasti Naveen) are Gurbani Akhar encoded. They draw Gurmukhi when you type the Gurbani Akhar keys, so siq nwmu appears as ਸਤਿ ਨਾਮੁ. If you paste Unicode Gurmukhi into them, the letters will not match the font and you will see blank boxes or the device's default Gurmukhi font.
The fix is a one-step conversion. Paste your Unicode text into the Punjabi Unicode Converter, copy the Gurbani Akhar output, then set the font in your document. The Gurbani Akhar vs Unicode guide explains why this is needed.
Troubleshooting
- The font is installed but does not appear in the app. Close the app fully and reopen it. Most programs only read the font list when they start.
- Windows says the file is not a valid font. The .zip was probably not extracted. Right-click it and choose Extract All, then install from the new folder.
- Some letters are missing or show as boxes. You are typing Unicode into a Gurbani Akhar font, or the other way round. Convert the text first.
- The font looks different in a PDF. Make sure fonts are embedded when you export. In most apps this is the default, but some online tools substitute fonts.
- Sharing a document. The person receiving it needs the same font installed, or the text will fall back to a default font. Export to PDF with fonts embedded, or convert the text to Unicode before sending.
Questions
Yes. All three fonts on the Fonts page are free to download and use. The licence text is included in each .zip.