One thing worth saying first. This is the most-used component on the whole site — people open it in seconds, often mid-wudu, sometimes one-handed on a phone. Whichever option you pick, we would keep it calm: legible numbers, one clear highlight, and no animation on the times themselves. The differences below are about layout and weight, not decoration.
Six tiles, light
Currently on Home A and B
Today’s Prayer Times
Today ·
الفَجْر
Fajr
Begins
5:12 AM
Jama’ah
5:45
الشُرُوق
Sunrise
Begins
6:48 AM
Jama’ah
—
الظُّهْر
Zuhr
Begins
1:02 PM
Jama’ah
1:30
العَصْر
Asr
Begins
4:38 PM
Jama’ah
5:00
المَغْرِب
Maghrib
Begins
7:44 PM
Jama’ah
7:49
العِشَاء
Isha
Begins
9:12 PM
Jama’ah
9:30
Dark board with live clock
Currently on Home C — closest to the MasjidBox display boards
00:00:00
Today · · Sample data
00:00:00
الفَجْر
Fajr
5:12 AM
5:45
Iqamah
الشُرُوق
Sunrise
6:48 AM
—
الظُّهْر
Zuhr
1:02 PM
1:30
Iqamah
العَصْر
Asr
4:38 PM
5:00
Iqamah
المَغْرِب
Maghrib
7:44 PM
7:49
Iqamah
العِشَاء
Isha
9:12 PM
9:30
Iqamah
Compact bar
One line. Could also sit under the header on every page
Split — next prayer large, rest listed
Answers “when is the next one?” before anything else
Next jama’ah
Asr
5:00
in 2h 14m
Classic table
Plainest option. Closest to a printed timetable
| Prayer | Begins | Jama’ah |
|---|---|---|
| Fajr الفَجْر | 5:12 AM | 5:45 AM |
| Sunrise الشُرُوق | 6:48 AM | — |
| Zuhr الظُّهْر | 1:02 PM | 1:30 PM |
| Asr العَصْر | 4:38 PM | 5:00 PM |
| Maghrib المَغْرِب | 7:44 PM | 7:49 PM |
| Isha العِشَاء | 9:12 PM | 9:30 PM |
Progress ring
Shows how much of the current window is left
If you want our view
What we would pick
Option 2 (the dark board) for the homepage, and option 5 (the table) on the prayer times page itself.
Option 2 because it is the one your congregation already recognises — it looks like the board on the wall, it shows the live clock people glance at, and it marks the window you are currently in rather than only the next prayer, which is what someone arriving late actually needs to know.
Option 5 on the full timetable page because a real table prints properly and reads correctly in a screen reader, and that page ends up on fridge doors.
Option 1 is the safe middle if the dark board feels too heavy for the homepage. Option 3 is worth considering in addition to whichever you choose — as a slim strip under the header on every page, so the times are never more than a glance away.
Whatever you choose is a small change to make. Tell us a number, or a combination.