diff --git a/frontend/pages/hours.vue b/frontend/pages/hours.vue
index ed5456b..269252e 100644
--- a/frontend/pages/hours.vue
+++ b/frontend/pages/hours.vue
@@ -2,8 +2,26 @@
     <div class="h-full overflow-hidden flex flex-col">
         <div class="flex flex-wrap items-center justify-between gap-4">
             <h1 class="text-2xl font-bold text-primary-500 lg:text-4xl">Heures</h1>
+            <button
+                v-if="isAdmin"
+                type="button"
+                class="flex items-center gap-2 rounded-md bg-primary-500 px-4 py-2 text-md font-semibold text-white hover:bg-secondary-500"
+                @click="isExportDrawerOpen = true"
+            >
+                <Icon name="mdi:file-export-outline" />
+                Exporter
+            </button>
         </div>
 
+        <HoursDayExportDrawer
+            v-model="isExportDrawerOpen"
+            :sites="sites"
+            :initial-date="selectedDate"
+            :initial-site-ids="selectedSiteIds"
+            :is-loading="isExporting"
+            @submit="handleExport"
+        />
+
         <HoursToolbar
             v-model:selected-date="selectedDate"
             v-model:view-mode="viewMode"
@@ -213,6 +231,21 @@ const {
   reloadWeeklySummary
 } = useHoursPage()
 
+const { printPdf } = usePdfPrinter()
+const isExportDrawerOpen = ref(false)
+const isExporting = ref(false)
+
+const handleExport = async (payload: { date: string; siteIds: number[] }) => {
+    isExporting.value = true
+    try {
+        const siteIdsParam = payload.siteIds.join(',')
+        await printPdf(`/work-hours/day-export?workDate=${payload.date}&siteIds=${siteIdsParam}`)
+        isExportDrawerOpen.value = false
+    } finally {
+        isExporting.value = false
+    }
+}
+
 useHead({
     title: 'Heures'
 })