Islamic Date and Month Today in Pakistan & Globally

body { margin: 0; background: #f3f4f6; font-family: 'Poppins', sans-serif; }

/* WRAPPER */ .islamic-table-wrapper { max-width: 520px; margin: 25px auto; background: #ffffff; border-radius: 16px; border: 1px solid #e5e7eb; overflow: hidden; }

/* HEADER */ .islamic-table-header { background: linear-gradient(135deg, #065f46, #064e3b); color: #fff; text-align: center; padding: 16px; font-size: 16px; font-weight: 600; }

/* TABLE */ .islamic-table { width: 100%; border-collapse: collapse; }

/* ROWS */ .islamic-table tr { border-bottom: 1px solid #f1f5f9; transition: 0.2s; }

.islamic-table tr:hover { background: #f9fafb; }

/* CELLS */ .islamic-table td { padding: 14px 16px; font-size: 13px; vertical-align: top; }

/* LABEL */ .label { color: #6b7280; font-weight: 500; text-transform: uppercase; font-size: 11px; margin-bottom: 4px; display: block; }

/* VALUE */ .value { color: #111827; font-weight: 600; font-size: 14px; }

/* HIGHLIGHT */ .highlight { display: inline-block; margin-top: 6px; background: #ecfdf5; color: #059669; padding: 3px 10px; border-radius: 20px; font-size: 12px; font-weight: 500; }

/* INFO TEXT */ .info-row { background: #f9fafb; }

.info-text { font-size: 12px; color: #374151; line-height: 1.6; }

/* MOBILE */ @media(max-width:480px) { .islamic-table td { padding: 12px; font-size: 12px; }

.value { font-size: 13px; } }

Islamic Calendar (Hijri Date Today)

Gregorian Date ---

Pakistan Hijri Date --- ---

const ISLAMIC_MONTH_DATA = [ { id: 1, name: "Muharram", startYear: 2026, startMonth: 5, startDay: 15, length: 30 }, { id: 2, name: "Safar", startYear: 2026, startMonth: 6, startDay: 15, length: 30 }, { id: 3, name: "Rabi' al-Awwal", startYear: 2026, startMonth: 7, startDay: 14, length: 29 }, { id: 4, name: "Rabi' al-Thani", startYear: 2026, startMonth: 8, startDay: 12, length: 30 }, { id: 5, name: "Jumada al-Awwal", startYear: 2026, startMonth: 9, startDay: 12, length: 30 }, { id: 6, name: "Jumada al-Thani", startYear: 2026, startMonth: 10, startDay: 11, length: 29 }, { id: 7, name: "Rajab", startYear: 2026, startMonth: 11, startDay: 10, length: 30 }, { id: 8, name: "Sha'ban", startYear: 2027, startMonth: 0, startDay: 9, length: 30 }, { id: 9, name: "Ramadan", startYear: 2027, startMonth: 1, startDay: 8, length: 30 }, { id: 10, name: "Shawwal", startYear: 2027, startMonth: 2, startDay: 10, length: 29 }, { id: 11, name: "Dhu al-Qadah", startYear: 2027, startMonth: 3, startDay: 8, length: 30 }, { id: 12, name: "Dhu al-Hijjah", startYear: 2027, startMonth: 4, startDay: 8, length: 29 } ];

function getDetailedHijriDate(date, offsetDays = 0) { const adjustedDate = new Date(date); adjustedDate.setDate(adjustedDate.getDate() + offsetDays); adjustedDate.setHours(0,0,0,0);

let matchedMonthIndex = -1; let currentDayOfHijriMonth = -1;

for (let i = 0; i < ISLAMIC_MONTH_DATA.length; i++) { const monthInfo = ISLAMIC_MONTH_DATA[i]; const monthStartDate = new Date(monthInfo.startYear, monthInfo.startMonth, monthInfo.startDay); monthStartDate.setHours(0,0,0,0); const monthEndDate = new Date(monthStartDate); monthEndDate.setDate(monthEndDate.getDate() + monthInfo.length);

if (adjustedDate >= monthStartDate && adjustedDate < monthEndDate) { matchedMonthIndex = i; const diffTime = Math.abs(adjustedDate - monthStartDate); currentDayOfHijriMonth = Math.floor(diffTime / (1000 * 60 * 60 * 24)) + 1; break; } }

if (matchedMonthIndex === -1) { if (adjustedDate < new Date(2026, 5, 15)) { return { day: 29, monthName: "Dhu al-Hijjah", year: 1447 }; } return { day: 1, monthName: "Muharram", year: 1449 }; }

return { day: currentDayOfHijriMonth, monthName: ISLAMIC_MONTH_DATA[matchedMonthIndex].name, year: 1448 }; }

function updateIslamicDates() { const today = new Date();

const gregorian = today.toLocaleDateString('en-PK', { weekday: 'long', day: '2-digit', month: 'long', year: 'numeric' });

const worldHijri = getDetailedHijriDate(today, 0); const pakistanHijri = getDetailedHijriDate(today, -1);

const localHijriStr = `${pakistanHijri.day} ${pakistanHijri.monthName} ${pakistanHijri.year} AH`; const globalHijriStr = `${worldHijri.day} ${worldHijri.monthName} ${worldHijri.year} AH (Global)`;

document.getElementById("gregorian-date").innerText = gregorian; document.getElementById("pakistan-date").innerText = localHijriStr; document.getElementById("world-date").innerText = globalHijriStr;

document.getElementById("info-text").innerHTML = `Today is ${gregorian} , which corresponds to ${localHijriStr} in Pakistan. Islamic dates are determined by lunar sightings and may vary by region.`; }

updateIslamicDates(); setInterval(updateIslamicDates, 3600000);

/* ===== ISLAMIC MONTHS WIDGET ONLY ===== */ .islamic-months-widget { width: 100%; max-width: 520px; margin: 20px auto; box-sizing: border-box; font-family: Poppins, Arial, sans-serif; }

.islamic-months-widget *, .islamic-months-widget *::before, .islamic-months-widget *::after { box-sizing: border-box; }

/* CONTAINER */ .islamic-months-wrapper { width: 100%; background: #ffffff; border: 1px solid #e5e7eb; border-radius: 14px; overflow: hidden; }

/* HEADER */ .islamic-months-header { width: 100%; background: linear-gradient(135deg, #065f46, #064e3b); color: #ffffff; text-align: center; padding: 13px 10px; font-size: 14px; line-height: 1.4; font-weight: 600; }

/* TABLE */ .islamic-months-table { width: 100%; margin: 0; padding: 0; border-collapse: collapse; table-layout: fixed; }

/* ROW */ .islamic-months-table tr { border-bottom: 1px solid #f1f5f9; }

.islamic-months-table tr:last-child { border-bottom: 0; }

/* CELLS */ .islamic-months-table td { padding: 11px 14px; vertical-align: middle; line-height: 1.4; }

/* LEFT COLUMN */ .islamic-months-table td:first-child { width: 70%; text-align: left; }

/* RIGHT COLUMN */ .islamic-months-table td:last-child { width: 30%; text-align: right; }

/* MONTH NAME */ .islamic-month-name { color: #111827; font-size: 13px; font-weight: 600; white-space: normal; }

/* ARABIC */ .islamic-month-arabic { display: inline-block; margin-left: 5px; color: #059669; font-size: 13px; font-weight: 500; direction: rtl; }

/* STATUS */ .islamic-month-status { color: #6b7280; font-size: 11px; white-space: nowrap; }

/* ACTIVE MONTH */ .islamic-months-table tr.active-month { background: #ecfdf5; }

.islamic-months-table tr.active-month .islamic-month-name { color: #065f46; }

.islamic-months-table tr.active-month .islamic-month-arabic { color: #047857; }

.islamic-months-table tr.active-month .islamic-month-status { color: #047857; font-weight: 600; }

/* ===== TABLET ===== */ @media (max-width: 767px) {

.islamic-months-widget { width: 100%; max-width: 100%; margin: 15px 0; }

.islamic-months-wrapper { border-radius: 12px; }

.islamic-months-header { font-size: 13px; padding: 12px 8px; }

.islamic-months-table td { padding: 10px 12px; } }

/* ===== MOBILE ===== */ @media (max-width: 480px) {

.islamic-months-widget { width: 100%; max-width: 100%; margin: 12px 0; }

.islamic-months-table td:first-child { width: 68%; }

.islamic-months-table td:last-child { width: 32%; }

.islamic-months-table td { padding: 9px 10px; }

.islamic-month-name { font-size: 12px; }

.islamic-month-arabic { font-size: 12px; margin-left: 3px; }

.islamic-month-status { font-size: 10px; } }

/* ===== VERY SMALL PHONES ===== */ @media (max-width: 360px) {

.islamic-months-header { font-size: 12px; padding: 10px 6px; }

.islamic-months-table td { padding: 8px 7px; }

.islamic-month-name, .islamic-month-arabic { font-size: 11px; }

.islamic-month-status { font-size: 9px; } }

Islamic Hijri Months (الأشهر الهجرية)

(function () {

const ISLAMIC_MONTH_DATA = [ { id: 1, name: "Muharram", arabic: "المحرّم", startYear: 2026, startMonth: 5, startDay: 15, length: 30 }, { id: 2, name: "Safar", arabic: "صفر", startYear: 2026, startMonth: 6, startDay: 15, length: 30 }, { id: 3, name: "Rabi' al-Awwal", arabic: "ربيع الأول", startYear: 2026, startMonth: 7, startDay: 14, length: 29 }, { id: 4, name: "Rabi' al-Thani", arabic: "ربيع الآخر", startYear: 2026, startMonth: 8, startDay: 12, length: 30 }, { id: 5, name: "Jumada al-Awwal", arabic: "جمادى الأولى", startYear: 2026, startMonth: 9, startDay: 12, length: 30 }, { id: 6, name: "Jumada al-Thani", arabic: "جمادى الآخرة", startYear: 2026, startMonth: 10, startDay: 11, length: 29 }, { id: 7, name: "Rajab", arabic: "رجب", startYear: 2026, startMonth: 11, startDay: 10, length: 30 }, { id: 8, name: "Sha'ban", arabic: "شعبان", startYear: 2027, startMonth: 0, startDay: 9, length: 30 }, { id: 9, name: "Ramadan", arabic: "رمضان", startYear: 2027, startMonth: 1, startDay: 8, length: 30 }, { id: 10, name: "Shawwal", arabic: "شوال", startYear: 2027, startMonth: 2, startDay: 10, length: 29 }, { id: 11, name: "Dhu al-Qadah", arabic: "ذو القعدة", startYear: 2027, startMonth: 3, startDay: 8, length: 30 }, { id: 12, name: "Dhu al-Hijjah", arabic: "ذو الحجة", startYear: 2027, startMonth: 4, startDay: 8, length: 29 } ];

function getCurrentHijriMonthIndex() {

const today = new Date(); today.setHours(0, 0, 0, 0);

for (let i = 0; i < ISLAMIC_MONTH_DATA.length; i++) {

const month = ISLAMIC_MONTH_DATA[i];

const startDate = new Date( month.startYear, month.startMonth, month.startDay );

startDate.setHours(0, 0, 0, 0);

const endDate = new Date(startDate);

endDate.setDate( endDate.getDate() + month.length );

if (today >= startDate && today < endDate) { return i; } }

return -1; }

function updateIslamicMonthsTable() {

const tableBody = document.getElementById("islamic-months-table-body");

if (!tableBody) return;

const activeIndex = getCurrentHijriMonthIndex();

let html = "";

ISLAMIC_MONTH_DATA.forEach(function (month, index) {

const isActive = index === activeIndex;

html += `

${month.name}

${month.arabic}

${isActive ? "Current Month" : "Month " + String(month.id).padStart(2, "0") }

`; });

tableBody.innerHTML = html; }

/* Run after page loads */ if (document.readyState === "loading") {

document.addEventListener( "DOMContentLoaded", updateIslamicMonthsTable );

} else {

updateIslamicMonthsTable(); }

/* Refresh once every hour */ setInterval( updateIslamicMonthsTable, 60 * 60 * 1000 );

})();

Islamic Calendar 2026

body{ margin:0; font-family:'Poppins',sans-serif; background:#f3f4f6; }

/* CONTAINER */ .calendar{ max-width:520px; margin:20px auto; background:#fff; border-radius:12px; border:1px solid #e5e7eb; overflow:hidden; }

/* HEADER */ .header{ background:#065f46; color:white; padding:12px; text-align:center; font-size:14px; font-weight:600; }

/* NAV */ .nav{ display:flex; justify-content:space-between; padding:8px 12px; border-bottom:1px solid #eee; }

button{ font-size:11px; padding:5px 10px; border:none; background:#ecfdf5; color:#065f46; border-radius:6px; cursor:pointer; }

/* WEEK DAYS */ .weekdays{ display:grid; grid-template-columns:repeat(7,1fr); background:#f9fafb; padding:6px 0; border-bottom:1px solid #eee; }

.weekday{ text-align:center; font-size:10px; color:#6b7280; }

/* GRID */ .grid{ display:grid; grid-template-columns:repeat(7,1fr); gap:6px; padding:10px; }

/* DAY BOX */ .day{ background:#f9fafb; border:1px solid #f1f5f9; border-radius:8px; padding:6px; min-height:55px; font-size:10px; }

.day:hover{ background:#ecfdf5; }

/* EMPTY */ .empty{ visibility:hidden; }

/* TODAY */ .today{ background:#d1fae5; border-color:#059669; }

/* TEXT */ .g-date{ font-size:11px; font-weight:600; }

.p-date{ font-size:9px; color:#059669; font-weight:500; }

Prev Next

Mon Tue Wed Thu Fri Sat Sun

let displayDate = new Date(); let today = new Date();

// Pakistan Islamic Calendar Month Data (Starts calibrated with 1 Rabi' al-Awwal 1448 AH) const islamicMonths = [ { name: "Muharram", startYear: 2026, startMonth: 5, startDay: 16, length: 30, year: 1448 }, { name: "Safar", startYear: 2026, startMonth: 6, startDay: 16, length: 30, year: 1448 }, { name: "Rabi' al-Awwal", startYear: 2026, startMonth: 7, startDay: 15, length: 29, year: 1448 }, { name: "Rabi' al-Thani", startYear: 2026, startMonth: 8, startDay: 13, length: 30, year: 1448 }, { name: "Jumada al-Awwal", startYear: 2026, startMonth: 9, startDay: 13, length: 30, year: 1448 }, { name: "Jumada al-Thani", startYear: 2026, startMonth: 10, startDay: 12, length: 29, year: 1448 }, { name: "Rajab", startYear: 2026, startMonth: 11, startDay: 11, length: 30, year: 1448 }, { name: "Sha'ban", startYear: 2027, startMonth: 0, startDay: 10, length: 30, year: 1448 }, { name: "Ramadan", startYear: 2027, startMonth: 1, startDay: 9, length: 30, year: 1448 }, { name: "Shawwal", startYear: 2027, startMonth: 2, startDay: 11, length: 29, year: 1448 }, { name: "Dhu al-Qadah", startYear: 2027, startMonth: 3, startDay: 9, length: 30, year: 1448 }, { name: "Dhu al-Hijjah", startYear: 2027, startMonth: 4, startDay: 9, length: 29, year: 1448 } ];

function getIslamicDetails(date){ let target = new Date(date); target.setHours(0,0,0,0);

for (let i = 0; i < islamicMonths.length; i++) { let im = islamicMonths[i]; let start = new Date(im.startYear, im.startMonth, im.startDay); start.setHours(0,0,0,0); let nextStart = new Date(start); nextStart.setDate(nextStart.getDate() + im.length);

if (target >= start && target < nextStart) { let diff = Math.floor((target - start) / 86400000) + 1; return { day: diff, month: im.name }; } }

// Default fallback calculation if outside explicit array dates let start = new Date(2026, 7, 15); start.setHours(0,0,0,0); let diff = Math.floor((target - start) / 86400000) + 1; return { day: diff > 0 ? diff : 1, month: "Rabi' al-Awwal" }; }

function renderCalendar(){

let body=document.getElementById("calendarBody"); body.innerHTML="";

let year=displayDate.getFullYear(); let month=displayDate.getMonth();

document.getElementById("monthYear").innerText= displayDate.toLocaleString('default',{month:'long',year:'numeric'});

let firstDay=new Date(year,month,1).getDay(); firstDay = (firstDay===0)?6:firstDay-1;

let daysInMonth=new Date(year,month+1,0).getDate();

/* EMPTY CELLS */ for(let i=0;i<firstDay;i++){ let div=document.createElement("div"); div.className="day empty"; body.appendChild(div); }

/* DAYS */ for(let i=1;i<=daysInMonth;i++){

let curr=new Date(year,month,i); let p=getIslamicDetails(curr);

let div=document.createElement("div"); div.className="day";

if(curr.toDateString()==today.toDateString()){ div.classList.add("today"); }

div.innerHTML=` ${i} ${p.day} ${p.month} `;

body.appendChild(div); }

}

function moveMonth(dir){ displayDate.setMonth(displayDate.getMonth()+dir); renderCalendar(); }

renderCalendar();

Islamic Date and Month Today in Pakistan & Globally

US decides to further increase economic pressure on Iran

Punjabi Date Today in Pakistan – Desi Mahina, Punjabi Calendar & Ajj Di Tareekh

Muhammad Ali (Web Desk Reporter)

Punjabi Date Today in Pakistan – Desi Mahina, Punjabi Calendar & Ajj Di Tareekh

Leave a Reply Cancel reply

Oil Prices Rise as Traders Monitor Supply Risks

Pakistan Targets Rs2.2 Trillion in SME Loans by 2028

Regulator Seeks Changes to Pakistan’s Electricity Rules

Finance Minister Seeks Stronger G-24 Voice for Developing Nations

Pakistan Must Plan the Power Behind Its AI Ambitions

Useful Categories

Useful Links

Contact Us!