A community-maintained open-source font for the Saudi Riyal currency symbol.
This font allows you to use the Saudi Riyal symbol in websites, applications, and documents, ensuring compatibility where the symbol is not natively supported.
📦 Package Information
📊 Repository Stats
🔄 Compatibility
📈 Project Status
👥 Social
🎉 Check out the live demo here:
🔗 Saudi Riyal Font Demo
Below is a screenshot of the example demo page:
👉 Cross-Platform Compatibility – Works on Windows, macOS, Linux, Web, and Mobile.
👉 Unicode Private Use Area (U+E900) – Ensures seamless integration.
👉 Web-Optimized – Includes .woff, .woff2, and .ttf formats for fast loading.
👉 NPM Support – Easily install via NPM for web projects.
👉 CDN Hosting – Use without installation via jsDelivr or unpkg.
👉 Open Source & Free – Released under the SIL Open Font License (OFL).
👉 Customizable – Modify and enhance as needed.
The easiest way to use this font in a web project is by installing it via NPM:
npm install @emran-alhaddad/saudi-riyal-fontThen, import it in your project:
import '@emran-alhaddad/saudi-riyal-font/index.css';Use it in HTML:
<span class="icon-saudi_riyal"></span>Alternatively, insert the symbol using Unicode:
<span style="font-family: 'saudi_riyal'"></span><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@emran-alhaddad/saudi-riyal-font/index.css"><link rel="stylesheet" href="https://unpkg.com/@emran-alhaddad/saudi-riyal-font/index.css"><!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Saudi Riyal Font Demo</title>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@emran-alhaddad/saudi-riyal-font/index.css">
</head>
<body>
<h1>Saudi Riyal Font Demo</h1>
<p>Price: <span class="icon-saudi_riyal"></span> 100</p>
</body>
</html>Important note for React Native / Expo users
The JavaScript entry point of this package uses the browser URL API to locate font assets. When running under React Native with the Hermes engine (for example, Expo SDK 53), the URL API is not implemented. This causes an error like:
ERROR [runtime not ready]: Error: URL.protocol is not implemented, js engine: hermes
ERROR [runtime not ready]: Invariant Violation: "main" has not been registered.
To use the Saudi Riyal Font in React Native or Expo:
-
Install a URL polyfill (recommended) Install
react-native-url-polyfilland import it before any other code. This polyfillsURL.protocoland related methods so Hermes can run code that depends on theURLAPI.npm install react-native-url-polyfill
// In your entry file (e.g. index.js or App.tsx) import 'react-native-url-polyfill/auto'; // ...rest of your imports
-
Load the font file directly Alternatively, skip the JavaScript entry point of this package and load the
.ttffile directly withexpo-font:import { useFonts } from 'expo-font'; // Adjust the path to the TTF file as needed const [loaded] = useFonts({ SaudiRiyal: require('./node_modules/@emran-alhaddad/saudi-riyal-font/fonts/saudi_riyal.ttf'), });
Once the font is loaded, apply it by name in your styles.
For more details or to track progress on React Native support, see issue #19.
- Download
saudi_riyal.ttffrom the link above. - Right-click the file and select "Install".
- Open Microsoft Word, Photoshop, or any editor, select "Saudi Riyal" as the font.
- Type
E900and pressAlt + Xto display the Saudi Riyal symbol.
- Download
saudi_riyal.ttffrom the link above. - Double-click the file and select "Install Font".
- Open any text editor (e.g., Pages, Photoshop), select "Saudi Riyal" as the font.
- Type
E900to insert the Riyal symbol.
-
Copy the font to your local fonts directory:
cp saudi_riyal.ttf ~/.fonts/ fc-cache -fv -
Use it in applications that support custom fonts.
- Download
saudi_riyal.ttfto your phone. - Android: Use iFont or FontFix apps to install.
- iOS: Install via iFont or a font management app.
- Use in supported apps like Word, Photoshop, or Notes.
We welcome contributions! To contribute:
- Fork this repository.
- Make your changes (improve the font, add glyphs).
- Submit a Pull Request for review.
If you find issues, please report them via the Issues section.
This font is released under the SIL Open Font License (OFL). ✅ Attribution is required!
📌 Created by: Emran Alhaddad 📧 Contact: [email protected]
📢 Any usage, modification, or distribution must credit the original creator.
Saudi Riyal Font © Emran Alhaddad - Used under SIL Open Font License 1.1
📩 For questions, feedback, or collaborations, reach out via GitHub Issues or email at [email protected].
🚀 Enjoy the Saudi Riyal Font!
