Simple Prayer Times

About the Component

Prayer times are calculated using the Aladhan API with Muslim World League method. Times may vary slightly.

The component is fully customizable through the following properties found on the right panel:

• City and country selection for accurate local prayer times

• Optional real-time clock display that updates every second

• Next prayer automatically highlighted with customizable border

• Full control over background, card, text, shadows, accent, and highlight colors

• Three separate font settings for header, prayer names, and times.

• Border radius adjustment and responsive width/height support.

• Prayer highlighting refreshes every minute, ensuring accuracy throughout the day.

Usage To use the component, simply add it to your Framer project, set your desired city and country, and customize the visual properties as needed. The prayer times will automatically fetch and display with the next prayer highlighted. Perfect for mosque websites, Islamic community portals, or any application requiring accurate prayer time displays with a clean, modern aesthetic that requires no coding knowledge.