QPC Hafs Script - With Tajweed Resource
This resource provides Quranic script in QPC Hafs Script - With Tajweed format.
The script uses Unicode text with specialized font rendering for digital applications.
Sample JSON
{
"1:1": {
"verse_key": "1:1",
"text": "بِسۡمِ ٱللَّهِ ٱلرَّحۡمَٰنِ ٱلرَّحِيمِ",
"script_type": "text_uthmani_tajweed",
"font_family": "tajweed-new qpc-hafs",
"words": [
{
"position": 1,
"text": "بِسۡمِ",
"location": "1:1:1"
}
],
"page_number": 1,
"juz_number": 1,
"hizb_number": 1
}
}
Field Descriptions
Usage Examples
CSS Integration
/* Include the font family in your CSS */
.quran-text {
font-family: 'tajweed-new qpc-hafs', 'Amiri', serif;
direction: rtl;
text-align: right;
}
JavaScript Usage
// Fetch verse data
fetch('/api/v1/verses/1:1.json')
.then(response => response.json())
.then(data => {
document.getElementById('verse').innerHTML = data.text;
document.getElementById('verse').className = 'tajweed-new qpc-hafs';
});
Features
- High-quality Arabic text rendering
- Proper diacritical marks and Tajweed annotations
- Responsive design for different screen sizes
- Word-by-word display for detailed study
- Unicode text for easy copying and searching
- Scalable vector rendering