Back to Work
04 / 05
Case Study #04Frontend Developer2025

Quran Mazid

A comprehensive Quran reader application rendering all 114 surahs and 6,236 ayahs with pristine Arabic typography. Supports multi-reciter audio playback with play, pause, and skip controls, flexible navigation by surah, juz, or page number, customisable Arabic font sizes and styles for comfortable reading, and a bookmark system to save and jump to any verse instantly. Built with React, TypeScript, and Vite for blazing-fast load times and a smooth reading experience.

Quran Mazid
Full page preview

Tech Stack & Tools

ReactTypeScriptViteNode.jsAudio API

6,236

Ayahs Rendered

114

Surahs

10+

Reciters

Key Features & Engineering Highlights

Full Quran with all 114 surahs and 6,236 ayahs in Arabic text

Multi-reciter audio playback with play, pause, and skip controls

Browse by surah, juz, or page number for quick navigation

Customisable Arabic font size and style for comfortable reading

Bookmark any ayah and jump to any verse instantly

Fast load times with Vite and TypeScript for type-safe code

Project Screenshots & Gallery

1 Images