Webfont Features Demo
Harmattan is an OpenType and Graphite-enabled font that supports the Arabic script. This page demonstrates the use of .woff fonts (using Harmattan) on a web page. A pdf showing the correct rendering of this text is also shown here.
The Harmattan font includes a number of optional features that provide alternative rendering that might be preferable for use in some contexts. The sections below enumerate the details of these features. Whether these features are available to users will depend on both the application and the rendering technology (Graphite or OpenType) being used. Most features are available in both Graphite and OpenType, though there may be minor differences in their implementation.
In Mozilla Firefox, with either Graphite or OpenType rendering, features can be accessed using the appropriate CSS markup. See the instructions on how to enable Graphite in Firefox (the technique described there works for both Graphite and OpenType).
Chrome, Safari, and Edge use OpenType rendering and features can be accessed using the appropriate CSS markup.
Test rendering engine choice
Here is a simple test to see if Graphite is working in your browser. If it is, the following will say “RenderingGraphite”. If your browser does not support Graphite it should say “RenderingOpentype”. Firefox is currently the only browser that supports Graphite. See the instructions on how to enable Graphite in Firefox.
| Check | RenderingUnknown |
Language
| Language | Sample | Rendering* | Feature setting |
|---|---|---|---|
| default | د ذ ڈ ډ ڊ ڋ ڌ ڍ ڎ ڏ ڐ ۮ ݙ ݚ ࢮ م ممم ݥ ݥݥݥ ݦ ݦݦݦ ࢧ ࢧࢧࢧ ه ههه ۴۵۶۷ ◌ِّ◌ٌ◌ُ | G,O,T | |
| Kurdish (Northern) | د ذ ڈ ډ ڊ ڋ ڌ ڍ ڎ ڏ ڐ ۮ ݙ ݚ ࢮ م ممم ݥ ݥݥݥ ݦ ݦݦݦ ࢧ ࢧࢧࢧ ه ههه ۴۵۶۷ ◌ِّ◌ٌ◌ُ | G,O,T | lang=kmr |
| Rohingya | د ذ ڈ ډ ڊ ڋ ڌ ڍ ڎ ڏ ڐ ۮ ݙ ݚ ࢮ م ممم ݥ ݥݥݥ ݦ ݦݦݦ ࢧ ࢧࢧࢧ ه ههه ۴۵۶۷ ◌ِّ◌ٌ◌ُ | G,T | lang=rhg |
| Sindhi (sd) | د ذ ڈ ډ ڊ ڋ ڌ ڍ ڎ ڏ ڐ ۮ ݙ ݚ ࢮ م ممم ݥ ݥݥݥ ݦ ݦݦݦ ࢧ ࢧࢧࢧ ه ههه ۴۵۶۷ ◌ِّ◌ٌ◌ُ | G,O,T | lang=sd |
| Urdu (ur) | د ذ ڈ ډ ڊ ڋ ڌ ڍ ڎ ڏ ڐ ۮ ݙ ݚ ࢮ م ممم ݥ ݥݥݥ ݦ ݦݦݦ ࢧ ࢧࢧࢧ ه ههه ۴۵۶۷ ◌ِّ◌ٌ◌ُ | G,O,T | lang=ur |
| Wolof (wo) | د ذ ڈ ډ ڊ ڋ ڌ ڍ ڎ ڏ ڐ ۮ ݙ ݚ ࢮ م ممم ݥ ݥݥݥ ݦ ݦݦݦ ࢧ ࢧࢧࢧ ه ههه ۴۵۶۷ ◌ِّ◌ٌ◌ُ | G,O,T | lang=wo |
Alef diacritic placement
Affects: U+0623, U+0625, U+0627, U+064E, U+0650, U+0654, U+0655
| Feature | Sample | Rendering* | Feature setting |
|---|---|---|---|
| Standard | أإاَاِأإلألإ | G,O,T | cv02=0 |
| Hamza touching | أإاَاِأإلألإ | G,O,T | cv02=1 |
| Touching | أإاَاِأإلألإ | G,O,T | cv02=2 |
Jeem/Hah
Affects: U+062C, U+062D, U+062E, U+0682, U+0683, U+0684, U+0685, U+0686, U+06BF, U+0757, U+0758, U+08A2, U+08C1, U+08C5, U+08C6
| Feature | Sample | Rendering* | Feature setting |
|---|---|---|---|
| Standard | ج ججج ح ححح خ خخخ ڂ ڂڂڂ ڃ ڃڃڃ ڄ ڄڄڄ څ څڅڅ چ چچچ ڿ ڿڿڿ ݗ ݗݗݗ ݘ ݘݘݘ ࢢ ࢢࢢࢢ ࣁ ࣁࣁࣁ ࣅ ࣅࣅࣅ ࣆ ࣆࣆࣆ | G,O,T | cv08=0 |
| Handwritten | ج ججج ح ححح خ خخخ ڂ ڂڂڂ ڃ ڃڃڃ ڄ ڄڄڄ څ څڅڅ چ چچچ ڿ ڿڿڿ ݗ ݗݗݗ ݘ ݘݘݘ ࢢ ࢢࢢࢢ ࣁ ࣁࣁࣁ ࣅ ࣅࣅࣅ ࣆ ࣆࣆࣆ | G,O,T | cv08=1 |
Dal
Affects: U+062F, U+0630, U+0688, U+0689, U+068A, U+068B, U+068C, U+068D, U+068E, U+068F, U+0690, U+06EE, U+0759, U+075A, U+08AE
| Feature | Sample | Rendering* | Feature setting |
|---|---|---|---|
| Standard | د ذ ڈ ډ ڊ ڋ ڌ ڍ ڎ ڏ ڐ ۮ ݙ ݚ ࢮ | G,O,T | cv12=0 |
| Alternate | د ذ ڈ ډ ڊ ڋ ڌ ڍ ڎ ڏ ڐ ۮ ݙ ݚ ࢮ | G,O,T | cv12=1 |
Sad/Dad
Affects: U+0635, U+0636, U+069D, U+069E, U+06FB, U+08AF
| Feature | Sample | Rendering* | Feature setting |
|---|---|---|---|
| Standard | ص صصص ض ضضض ڝ ڝڝڝ ڞ ڞڞڞ ࢯࢯࢯ ࢯ ۻ ۻۻۻ | G,O,T | cv20=0 |
| Half | ص صصص ض ضضض ڝ ڝڝڝ ڞ ڞڞڞ ࢯࢯࢯ ࢯ ۻ ۻۻۻ | G,O,T | cv20=1 |
Meem
Affects: U+0645, U+0765, U+0766, U+08A7
| Feature | Sample | Rendering* | Feature setting |
|---|---|---|---|
| Standard | م ممم ݥ ݥݥݥ ݦ ݦݦݦ ࢧ ࢧࢧࢧ | G,O,T | cv44=0 |
| Sindhi-style | م ممم ݥ ݥݥݥ ݦ ݦݦݦ ࢧ ࢧࢧࢧ | G,O,T | cv44=1 |
Heh
Affects: U+0647
| Feature | Sample | Rendering* | Feature setting |
|---|---|---|---|
| Standard | ه ههه | G,O,T | cv48=0 |
| Kurdish-style | ه ههه | G,O,T | cv48=3 |
| Sindhi-style | ه ههه | G,O,T | cv48=1 |
| Urdu-style | ه ههه | G,O,T | cv48=2 |
Arabic U
Affects: U+0677, U+06C7
| Feature | Sample | Rendering* | Feature setting |
|---|---|---|---|
| Standard | ٷ ۇ | G,O,T | cv50=0 |
| Filled | ٷ ۇ | G,O,T | cv50=1 |
Maddah
Affects: U+0622, U+0627, U+0653, U+0653
| Feature | Sample | Rendering* | Feature setting |
|---|---|---|---|
| Small | آ آ ◌ٓ | G,O,T | cv60=0 |
| Large | آ آ ◌ٓ | G,O,T | cv60=1 |
Shadda+kasra placement
Affects: U+064D, U+0650 with U+0651
| Feature | Sample | Rendering* | Feature setting |
|---|---|---|---|
| Default | بِّ ◌ِّ بٍّ ◌ٍّ | G,O,T | cv62=0 |
| Lowered | بِّ ◌ِّ بٍّ ◌ٍّ | G,O,T | cv62=1 |
| Raised | بِّ ◌ِّ بٍّ ◌ٍّ | G,),T | cv62=2 |
Damma
Affects: U+064F
| Feature | Sample | Rendering* | Feature setting |
|---|---|---|---|
| Standard | بُ ◌ُ | G,O,T | cv70=0 |
| Filled | بُ ◌ُ | G,O,T | cv70=1 |
| Short | بُ ◌ُ | G,O,T | cv70=2 |
Dammatan
Affects: U+064C
| Feature | Sample | Rendering* | Feature setting |
|---|---|---|---|
| Standard | بٌ ◌ٌ | G,O,T | cv72=0 |
| Six-nine | بٌ ◌ٌ | G,O,T | cv72=1 |
Inverted Damma
Affects: U+0657
| Feature | Sample | Rendering* | Feature setting |
|---|---|---|---|
| Standard | بٗ ◌ٗ | G,O,T | cv74=0 |
| Filled | بٗ ◌ٗ | G,O,T | cv74=2 |
Superscript Alef
Affects: U+0670 on all yeh, sad and seen-like characters
U+0649, U+064A, U+06D0, U+06D1, U+06CC, U+0635, U+0636, U+069D, U+069E, U+06FB, U+08AF, U+0633, U+0634, U+069A, U+069B, U+069C, U+06FA, U+076D, U+077E
| Feature | Sample | Rendering* | Feature setting |
|---|---|---|---|
| Small | ىٰ ىٰىٰىٰ يٰ يٰيٰيٰ ېٰ ېٰېٰېٰ ۑٰ ۑٰۑٰۑٰ یٰ یٰیٰیٰ صٰ صٰصٰصٰ ضٰ ضٰضٰضٰ ڝٰ ڝٰڝٰڝٰ ڞٰ ڞٰڞٰڞٰ ۻٰ ۻٰۻٰۻٰ سٰ سٰسٰسٰ شٰ شٰشٰشٰ ښٰ ښٰښٰښٰ ࢯٰࢯٰࢯٰ ࢯٰ ݭٰݭٰݭٰ ݭٰ ڛٰ ڛٰڛٰڛٰ ڜٰ ڜٰڜٰڜٰ ۺٰ ۺٰۺٰۺٰ ݾٰݾٰݾٰ ݾٰ | G,O,T | cv76=0 |
| Large | ىٰ ىٰىٰىٰ يٰ يٰيٰيٰ ېٰ ېٰېٰېٰ ۑٰ ۑٰۑٰۑٰ یٰ یٰیٰیٰ صٰ صٰصٰصٰ ضٰ ضٰضٰضٰ ڝٰ ڝٰڝٰڝٰ ڞٰ ڞٰڞٰڞٰ ۻٰ ۻٰۻٰۻٰ سٰ سٰسٰسٰ شٰ شٰشٰشٰ ښٰ ښٰښٰښٰ ࢯٰࢯٰࢯٰ ࢯٰ ݭٰݭٰݭٰ ݭٰ ڛٰ ڛٰڛٰڛٰ ڜٰ ڜٰڜٰڜٰ ۺٰ ۺٰۺٰۺٰ ݾٰݾٰݾٰ ݾٰ | G,O,T | cv76=1 |
Sukun
Affects: U+0652
| Feature | Sample | Rendering* | Feature setting |
|---|---|---|---|
| Closed | بْ ◌ْ | G,O,T | cv78=0 |
| Open down | بْ ◌ْ | G,O,T | cv78=1 |
| Open left | بْ ◌ْ | G,O,T | cv78=2 |
End of ayah
Affects: U+06DD
Firefox allows you to use U+06DD followed by the digits and proper rendering occurs. Some applications require the following:
- precede the entire sequence (subtending mark plus following digits) with
202D LEFT-TO-RIGHT OVERRIDE - follow the entire sequence with U+202C POP DIRECTIONAL FORMATTING.
Surrounding the sequence with U+202D and U+202C seems to give the most reliable results in different browsers. However, we have not found a solution that works in Internet Explorer/Edge.
| Feature | Sample | Rendering* | Feature setting |
|---|---|---|---|
| Standard (U+202D U+06DD U+0031 U+0032 U+0033 U+202C) |
123 | G,O,T | cv80=0 |
| Simplified A | 123 | G,O,T | cv80=1 |
| Simplified B | 123 | G,O,T | cv80=2 |
Eastern digits
Affects: U+06F4, U+06F6, U+06F7
| Feature | Sample | Rendering* | Feature setting |
|---|---|---|---|
| Standard | ۴۵۶۷ | G,O,T | cv82=0 |
| Sindhi-style | ۴۵۶۷ | G,O,T | cv82=1 |
| Urdu-style | ۴۵۶۷ | G,O,T | cv82=2 |
| Rohingya-style | ۴۵۶۷ | G,O,T | cv82=4 |
Comma
Affects: U+060C, U+061B
| Feature | Sample | Rendering* | Feature setting |
|---|---|---|---|
| Upward | ، ؛ | G,O,T | cv84=0 |
| Downward | ، ؛ | G,O,T | cv84=1 |
*Legend: G=Implemented in Graphite; O=Implemented in OpenType; T=Implemented in TypeTuner (command line version: http://scripts.sil.org/TypeTuner and web-based version: http://scripts.sil.org/ttw).