diff --git a/src/components/Download.tsx b/src/components/Download.tsx
new file mode 100644
index 0000000..9f24c9a
--- /dev/null
+++ b/src/components/Download.tsx
@@ -0,0 +1,98 @@
+import { submitJob } from '@arcgis/core/rest/geoprocessor';
+import { useQueryClient } from '@tanstack/react-query';
+import { Button, Select, SelectItem, Spinner } from '@ugrc/utah-design-system';
+import { useState } from 'react';
+import config from '../config';
+
+async function download(eventIds: string[], format: string): Promise<string> {
+  const jobInfo = await submitJob(config.urls.download, {
+    Event_Ids: eventIds.join(';'),
+    Format: format,
+  });
+
+  await jobInfo.waitForJobCompletion();
+
+  const parameter = await jobInfo.fetchResultData('Zip_File');
+  const value = parameter.value as __esri.DataFile;
+
+  return value.url.replace('http', 'https');
+}
+
+type State = {
+  format: string;
+  error: string | null;
+  isBusy: boolean;
+};
+
+export default function Download({ eventIds }: { eventIds: string[] }): JSX.Element {
+  const queryClient = useQueryClient();
+  const [state, setState] = useState<State>({
+    format: '',
+    error: null,
+    isBusy: false,
+  });
+
+  const updateState = (newState: Partial<State>) => setState((prev) => ({ ...prev, ...newState }));
+
+  const onDownloadClick = async () => {
+    if (eventIds.length === 0) {
+      console.warn('No data to download');
+
+      return;
+    }
+
+    updateState({ isBusy: true, error: null });
+
+    let url;
+    try {
+      url = await queryClient.fetchQuery({
+        queryKey: ['download', eventIds],
+        queryFn: () => download(eventIds as string[], state.format),
+      });
+    } catch (error) {
+      console.error('Error downloading data', error);
+      updateState({ error: 'There was an error with the download service', isBusy: false });
+
+      return;
+    }
+
+    const link = document.createElement('a');
+    link.href = url;
+    link.download = 'data.zip';
+    document.body.appendChild(link);
+    link.click();
+    document.body.removeChild(link);
+
+    updateState({ isBusy: false });
+  };
+
+  return (
+    <div className="p-4">
+      <p>This can take a few minutes to process.</p>
+      <Select
+        placeholder="select format"
+        selectedKey={state.format}
+        onSelectionChange={(key) => updateState({ format: key as string })}
+        aria-label="select format"
+        className="inline-flex py-2"
+      >
+        <SelectItem id="csv" aria-label="CSV">
+          CSV
+        </SelectItem>
+        <SelectItem id="fgdb" aria-label="File Geodatabase">
+          File Geodatabase
+        </SelectItem>
+      </Select>
+      <p>
+        <Button
+          isDisabled={!eventIds.length || state.isBusy || state.format === ''}
+          variant="secondary"
+          onPress={onDownloadClick}
+        >
+          {state.isBusy ? <Spinner /> : 'Download'}
+        </Button>
+      </p>
+      {state.error && <div className="text-sm text-rose-600 forced-colors:text-[Mark]">{state.error}</div>}
+    </div>
+  );
+}
diff --git a/src/components/ResultsGrid.tsx b/src/components/ResultsGrid.tsx
index d759760..311f7a7 100644
--- a/src/components/ResultsGrid.tsx
+++ b/src/components/ResultsGrid.tsx
@@ -2,9 +2,10 @@ import { useQuery } from '@tanstack/react-query';
 import { Spinner, useFirebaseAuth } from '@ugrc/utah-design-system';
 import { User } from 'firebase/auth';
 import ky from 'ky';
-import { TableBody } from 'react-aria-components';
+import { Tab, TableBody, TabList, TabPanel, Tabs } from 'react-aria-components';
 import config from '../config';
 import { useFilter } from './contexts/FilterProvider';
+import Download from './Download';
 import { getGridQuery, removeIrrelevantWhiteSpace } from './queryHelpers';
 import { Cell, Column, Row, Table, TableHeader } from './Table';
 
@@ -125,67 +126,82 @@ export default function ResultsGrid() {
     return <span>{error.message}</span>;
   }
 
+  const eventIds = data?.length ? (data.map((row) => row[config.fieldNames.EVENT_ID]) as string[]) : ([] as string[]);
+
   return (
     <>
-      <div className="px-2 py-2">Results: {data?.length}</div>
-      <Table aria-label="query results" className="-z-10 w-full border-t dark:border-t-zinc-300">
-        <TableHeader>
-          <Column id={config.fieldNames.EVENT_DATE} minWidth={120}>
-            Event Date
-          </Column>
-          <Column id={config.fieldNames.OBSERVERS} minWidth={120}>
-            Observers
-          </Column>
-          <Column id={`${config.fieldNames.WaterName}_Stream`} minWidth={170}>
-            Stream
-          </Column>
-          <Column id={`${config.fieldNames.DWR_WaterID}_Stream`} minWidth={120}>
-            Stream ID
-          </Column>
-          <Column id={`${config.fieldNames.ReachCode}_Stream`} minWidth={200}>
-            Stream Reach Code
-          </Column>
-          <Column id={`${config.fieldNames.WaterName}_Lake`} minWidth={150}>
-            Lake
-          </Column>
-          <Column id={`${config.fieldNames.DWR_WaterID}_Lake`} minWidth={120}>
-            Lake ID
-          </Column>
-          <Column id={`${config.fieldNames.ReachCode}_Lake`} minWidth={200}>
-            Lake Reach Code
-          </Column>
-          <Column id={STATION_NAME} minWidth={180}>
-            Station Name
-          </Column>
-          <Column id={config.fieldNames.SPECIES} minWidth={180}>
-            Species Codes
-          </Column>
-          <Column id={config.fieldNames.TYPES} minWidth={150}>
-            Equipment
-          </Column>
-          <Column id={config.fieldNames.EVENT_ID} isRowHeader minWidth={350}>
-            Event ID
-          </Column>
-        </TableHeader>
-        <TableBody items={data}>
-          {(row) => (
-            <Row>
-              <Cell>{new Date(row[config.fieldNames.EVENT_DATE] as number).toLocaleDateString()}</Cell>
-              <Cell>{row[config.fieldNames.OBSERVERS]}</Cell>
-              <Cell>{row[`${config.fieldNames.WaterName}_Stream`]}</Cell>
-              <Cell>{row[`${config.fieldNames.DWR_WaterID}_Stream`]}</Cell>
-              <Cell>{row[`${config.fieldNames.ReachCode}_Stream`]}</Cell>
-              <Cell>{row[`${config.fieldNames.WaterName}_Lake`]}</Cell>
-              <Cell>{row[`${config.fieldNames.DWR_WaterID}_Lake`]}</Cell>
-              <Cell>{row[`${config.fieldNames.ReachCode}_Lake`]}</Cell>
-              <Cell>{row[STATION_NAME]}</Cell>
-              <Cell>{row[config.fieldNames.SPECIES]}</Cell>
-              <Cell>{row[config.fieldNames.TYPES]}</Cell>
-              <Cell>{row[config.fieldNames.EVENT_ID]}</Cell>
-            </Row>
-          )}
-        </TableBody>
-      </Table>
+      <span className="absolute right-12 top-2 z-10 self-center">
+        Records: <strong>{data?.length}</strong>
+      </span>
+      <Tabs aria-label="results panel">
+        <TabList>
+          <Tab id="grid">Results</Tab>
+          <Tab id="download">Download</Tab>
+        </TabList>
+        <TabPanel id="grid">
+          <Table aria-label="query results" className="-z-10 w-full border-t dark:border-t-zinc-300">
+            <TableHeader>
+              <Column id={config.fieldNames.EVENT_DATE} minWidth={120}>
+                Event Date
+              </Column>
+              <Column id={config.fieldNames.OBSERVERS} minWidth={120}>
+                Observers
+              </Column>
+              <Column id={`${config.fieldNames.WaterName}_Stream`} minWidth={170}>
+                Stream
+              </Column>
+              <Column id={`${config.fieldNames.DWR_WaterID}_Stream`} minWidth={120}>
+                Stream ID
+              </Column>
+              <Column id={`${config.fieldNames.ReachCode}_Stream`} minWidth={200}>
+                Stream Reach Code
+              </Column>
+              <Column id={`${config.fieldNames.WaterName}_Lake`} minWidth={150}>
+                Lake
+              </Column>
+              <Column id={`${config.fieldNames.DWR_WaterID}_Lake`} minWidth={120}>
+                Lake ID
+              </Column>
+              <Column id={`${config.fieldNames.ReachCode}_Lake`} minWidth={200}>
+                Lake Reach Code
+              </Column>
+              <Column id={STATION_NAME} minWidth={180}>
+                Station Name
+              </Column>
+              <Column id={config.fieldNames.SPECIES} minWidth={180}>
+                Species Codes
+              </Column>
+              <Column id={config.fieldNames.TYPES} minWidth={150}>
+                Equipment
+              </Column>
+              <Column id={config.fieldNames.EVENT_ID} isRowHeader minWidth={350}>
+                Event ID
+              </Column>
+            </TableHeader>
+            <TableBody items={data}>
+              {(row) => (
+                <Row>
+                  <Cell>{new Date(row[config.fieldNames.EVENT_DATE] as number).toLocaleDateString()}</Cell>
+                  <Cell>{row[config.fieldNames.OBSERVERS]}</Cell>
+                  <Cell>{row[`${config.fieldNames.WaterName}_Stream`]}</Cell>
+                  <Cell>{row[`${config.fieldNames.DWR_WaterID}_Stream`]}</Cell>
+                  <Cell>{row[`${config.fieldNames.ReachCode}_Stream`]}</Cell>
+                  <Cell>{row[`${config.fieldNames.WaterName}_Lake`]}</Cell>
+                  <Cell>{row[`${config.fieldNames.DWR_WaterID}_Lake`]}</Cell>
+                  <Cell>{row[`${config.fieldNames.ReachCode}_Lake`]}</Cell>
+                  <Cell>{row[STATION_NAME]}</Cell>
+                  <Cell>{row[config.fieldNames.SPECIES]}</Cell>
+                  <Cell>{row[config.fieldNames.TYPES]}</Cell>
+                  <Cell>{row[config.fieldNames.EVENT_ID]}</Cell>
+                </Row>
+              )}
+            </TableBody>
+          </Table>
+        </TabPanel>
+        <TabPanel id="download">
+          <Download eventIds={eventIds} />
+        </TabPanel>
+      </Tabs>
     </>
   );
 }
diff --git a/src/components/Table.tsx b/src/components/Table.tsx
index b7ba74d..0d2afb7 100644
--- a/src/components/Table.tsx
+++ b/src/components/Table.tsx
@@ -24,7 +24,7 @@ import { composeTailwindRenderProps, focusRing } from './utils.ts';
 
 export function Table(props: TableProps) {
   return (
-    <ResizableTableContainer className="relative h-full w-full overflow-auto">
+    <ResizableTableContainer className="relative overflow-auto">
       <AriaTable {...props} />
     </ResizableTableContainer>
   );
diff --git a/src/config.ts b/src/config.ts
index 825d6f8..37029c8 100644
--- a/src/config.ts
+++ b/src/config.ts
@@ -65,6 +65,7 @@ const config = {
       'https://gis.trustlands.utah.gov/hosting/rest/services/Hosted/Land_Ownership_WM_VectorTile/VectorTileServer',
     streams: `${referenceMapService}/0`,
     lakes: `${referenceMapService}/1`,
+    download: `${functionsUrl}/toolbox/Download`,
   },
 };