diff --git a/frontend/src/components/CheckInPanel.vue b/frontend/src/components/CheckInPanel.vue
index 99481e03e8..ea356477b7 100644
--- a/frontend/src/components/CheckInPanel.vue
+++ b/frontend/src/components/CheckInPanel.vue
@@ -9,7 +9,7 @@
 			<Button
 				class="mt-4 mb-1 drop-shadow-sm py-5 text-base"
 				id="open-checkin-modal"
-				@click="checkinTimestamp = dayjs().format('YYYY-MM-DD HH:mm:ss')"
+				@click="fetchLocation"
 			>
 				<template #prefix>
 					<FeatherIcon
@@ -26,8 +26,8 @@
 				:initial-breakpoint="1"
 				:breakpoints="[0, 1]"
 			>
-				<div class="h-40 w-full flex flex-col items-center justify-center gap-5 p-4 mb-5">
-					<div class="flex flex-col gap-1.5 items-center justify-center">
+				<div class="h-120 w-full flex flex-col items-center justify-center gap-5 p-4 mb-5">
+					<div class="flex flex-col gap-1.5 mt-2 items-center justify-center">
 						<div class="font-bold text-xl">
 							{{ dayjs(checkinTimestamp).format("hh:mm:ss a") }}
 						</div>
@@ -35,10 +35,27 @@
 							{{ dayjs().format("D MMM, YYYY") }}
 						</div>
 					</div>
+					<div v-if="locationStatus" class="rounded border-4 translate-z-0 block overflow-hidden w-350 h-170">
+						<span class="font-medium text-gray-500 text-sm">
+							{{ locationStatus }}
+						</span>
+
+						<iframe
+							width="370"
+							height="170"
+							frameborder="1"
+							scrolling="no"
+							marginheight="0"
+							marginwidth="0"
+							:src="`https://maps.google.com/maps?q=${latitude},${longitude}&hl=en&z=17&amp;output=embed`"
+						>
+						</iframe>
+					</div>
 					<Button
 						variant="solid"
 						class="w-full py-5 text-sm"
 						@click="submitLog(nextAction.action)"
+						@disabled="!latitude || !longitude"
 					>
 						Confirm {{ nextAction.label }}
 					</Button>
@@ -64,6 +81,9 @@ const socket = inject("$socket")
 const employee = inject("$employee")
 const dayjs = inject("$dayjs")
 const checkinTimestamp = ref(null)
+const latitude = ref("")
+const longitude = ref("")
+const locationStatus = ref("")
 
 const checkins = createListResource({
 	doctype: DOCTYPE,
@@ -102,6 +122,43 @@ const lastLogTime = computed(() => {
 	return `${formattedTime} on ${dayjs(timestamp).format("D MMM, YYYY")}`
 })
 
+function success(position) {
+	latitude.value = position.coords.latitude
+	longitude.value = position.coords.longitude
+
+	locationStatus.value = `
+		Latitude: ${Number(latitude.value).toFixed(7)} °,
+		Longitude: ${Number(longitude.value).toFixed(7)} °
+	`
+}
+
+function error() {
+	locationStatus.value = "Unable to retrieve your location"
+}
+
+const fetchLocation = () => {
+	checkinTimestamp.value = dayjs().format("YYYY-MM-DD HH:mm:ss")
+
+	if (!navigator.geolocation) {
+		locationStatus.value =
+			"Geolocation is not supported by your current browser"
+	} else {
+		locationStatus.value = "Locating..."
+		navigator.geolocation.getCurrentPosition(success, error)
+	}
+
+	if ("geolocation" in navigator) {
+	} else {
+		toast({
+			title: "Error",
+			text: "Your current browser does not support geolocation",
+			icon: "alert-circle",
+			position: "bottom-center",
+			iconClasses: "text-red-500",
+		})
+	}
+}
+
 const submitLog = (logType) => {
 	const action = logType === "IN" ? "Check-in" : "Check-out"
 
@@ -110,6 +167,7 @@ const submitLog = (logType) => {
 			employee: employee.data.name,
 			log_type: logType,
 			time: checkinTimestamp.value,
+			geolocation: `{"type":"FeatureCollection","features":[{"type":"Feature","properties":{},"geometry":{"type":"Point","coordinates":[${longitude.value},${latitude.value}]}}]}`
 		},
 		{
 			onSuccess() {
diff --git a/frontend/yarn.lock b/frontend/yarn.lock
index 6f389c65ba..ac335744fc 100644
--- a/frontend/yarn.lock
+++ b/frontend/yarn.lock
@@ -2697,9 +2697,9 @@ doctrine@^3.0.0:
     esutils "^2.0.2"
 
 ejs@^3.1.6:
-  version "3.1.9"
-  resolved "https://registry.yarnpkg.com/ejs/-/ejs-3.1.9.tgz#03c9e8777fe12686a9effcef22303ca3d8eeb361"
-  integrity sha512-rC+QVNMJWv+MtPgkt0y+0rVEIdbtxVADApW9JXrUVlzHetgcyczP/E7DJmWJ4fJCZF2cPcBk0laWO9ZHMG3DmQ==
+  version "3.1.10"
+  resolved "https://registry.yarnpkg.com/ejs/-/ejs-3.1.10.tgz#69ab8358b14e896f80cc39e62087b88500c3ac3b"
+  integrity sha512-UeJmFfOrAQS8OJWPZ4qtgHyWExa088/MtK5UEyoJGFH67cDEXkZSviOiKRCZ4Xij0zxI3JECgYs3oKx+AizQBA==
   dependencies:
     jake "^10.8.5"
 
diff --git a/hrms/hr/doctype/employee_checkin/employee_checkin.json b/hrms/hr/doctype/employee_checkin/employee_checkin.json
index 146254d9e4..cacfb51e3a 100644
--- a/hrms/hr/doctype/employee_checkin/employee_checkin.json
+++ b/hrms/hr/doctype/employee_checkin/employee_checkin.json
@@ -15,8 +15,13 @@
   "device_id",
   "skip_auto_attendance",
   "attendance",
+  "location_section",
+  "coordinates",
+  "geolocation",
+  "shift_timings_section",
   "shift_start",
   "shift_end",
+  "column_break_vyyt",
   "shift_actual_start",
   "shift_actual_end"
  ],
@@ -107,10 +112,35 @@
    "fieldtype": "Datetime",
    "hidden": 1,
    "label": "Shift Actual End"
+  },
+  {
+   "fieldname": "location_section",
+   "fieldtype": "Section Break",
+   "label": "Location"
+  },
+  {
+   "fieldname": "coordinates",
+   "fieldtype": "Data",
+   "label": "Coordinates",
+   "read_only": 1
+  },
+  {
+   "fieldname": "geolocation",
+   "fieldtype": "Geolocation",
+   "label": "Geolocation"
+  },
+  {
+   "fieldname": "shift_timings_section",
+   "fieldtype": "Section Break",
+   "label": "Shift Timings"
+  },
+  {
+   "fieldname": "column_break_vyyt",
+   "fieldtype": "Column Break"
   }
  ],
  "links": [],
- "modified": "2024-04-02 01:50:23.150627",
+ "modified": "2024-04-03 06:36:07.640893",
  "modified_by": "Administrator",
  "module": "HR",
  "name": "Employee Checkin",
@@ -210,4 +240,4 @@
  "states": [],
  "title_field": "employee_name",
  "track_changes": 1
-}
\ No newline at end of file
+}
diff --git a/hrms/hr/doctype/employee_checkin/employee_checkin.py b/hrms/hr/doctype/employee_checkin/employee_checkin.py
index 8524b6ef6a..9c48b8a5c0 100644
--- a/hrms/hr/doctype/employee_checkin/employee_checkin.py
+++ b/hrms/hr/doctype/employee_checkin/employee_checkin.py
@@ -18,6 +18,7 @@ def validate(self):
 		validate_active_employee(self.employee)
 		self.validate_duplicate_log()
 		self.fetch_shift()
+		self.set_geolocation_coordinates()
 
 	def validate_duplicate_log(self):
 		doc = frappe.db.exists(
@@ -60,6 +61,19 @@ def fetch_shift(self):
 		else:
 			self.shift = None
 
+	def set_geolocation_coordinates(self):
+		if not self.geolocation:
+			return
+
+		try:
+			self.coordinates = str(get_coordinates_from_geolocation(self.geolocation))
+		except Exception:
+			frappe.log_error("Error parsing geolocation field")
+
+
+def get_coordinates_from_geolocation(geolocation: str):
+	return frappe.parse_json(geolocation)["features"][0]["geometry"]["coordinates"]
+
 
 @frappe.whitelist()
 def add_log_based_on_employee_field(
@@ -69,6 +83,7 @@ def add_log_based_on_employee_field(
 	log_type=None,
 	skip_auto_attendance=0,
 	employee_fieldname="attendance_device_id",
+	geolocation=None,
 ):
 	"""Finds the relevant Employee using the employee field value and creates a Employee Checkin.
 
@@ -78,6 +93,7 @@ def add_log_based_on_employee_field(
 	:param log_type: (optional)Direction of the Punch if available (IN/OUT).
 	:param skip_auto_attendance: (optional)Skip auto attendance field will be set for this log(0/1).
 	:param employee_fieldname: (Default: attendance_device_id)Name of the field in Employee DocType based on which employee lookup will happen.
+	:param geolocation: (optional)Geolocation in the format of GeoJSON. A JSON string is expected.
 	"""
 
 	if not employee_field_value or not timestamp:
@@ -104,6 +120,8 @@ def add_log_based_on_employee_field(
 	doc.time = timestamp
 	doc.device_id = device_id
 	doc.log_type = log_type
+	doc.geolocation = geolocation
+	doc.coordinates = get_coordinates_from_geolocation(str(geolocation))
 	if cint(skip_auto_attendance) == 1:
 		doc.skip_auto_attendance = "1"
 	doc.insert()