diff --git a/popup/index.tsx b/popup/index.tsx
index b869111..d8818c2 100644
--- a/popup/index.tsx
+++ b/popup/index.tsx
@@ -1,4 +1,4 @@
-import { ConfigProvider, Layout } from "antd"
+import { ConfigProvider, Layout, Button } from "antd"
 import Logo from "data-base64:~assets/icon.svg"
 import './index.scss'
 import theme from "~theme"
@@ -8,17 +8,25 @@ import { StartView } from "~views/start.view"
 import { CaptureView } from "~views/capture.view"
 import { useLocalStorage } from "~hooks/use-storage"
 
+const handleScrollDown = () => {
+  // Perform scroll down action here
+  window.scrollTo({ top: window.innerHeight, behavior: 'smooth' });
+};
+
 function IndexPopup() {
   return (
     <ConfigProvider theme={theme}>
       <Router location={'/capture'} >
         <Layout className="popup-layout">
-          <Layout.Header className="header">
+        <Layout.Header className="header">
             <div className="content">
               <div className="logo">
                 <img src={Logo} alt="Percy | BrowserStack" />
               </div>
             </div>
+            <div className="shortcut-button">
+                <Button type="primary" onClick={handleScrollDown}>Keyboard Shortcuts</Button>
+            </div>
           </Layout.Header>
           <Layout.Content className="popup-content">
             <Routes>
diff --git a/views/capture.view.tsx b/views/capture.view.tsx
index 423ac8d..d0f3fcd 100644
--- a/views/capture.view.tsx
+++ b/views/capture.view.tsx
@@ -1,120 +1,161 @@
-import { CheckCircleOutlined, EditOutlined } from "@ant-design/icons";
-import { sendToBackground, sendToContentScript } from "@plasmohq/messaging";
-import { Button, Divider, Form, Input, message, notification, Popconfirm, Space, Tag, Tooltip, Typography } from "antd";
-import React, { useEffect, useState } from "react";
-import SnapshotForm from "~components/snapshot.form";
-import { useLocalStorage, useSessionStorage } from "~hooks/use-storage";
-import type { PercyBuild } from "~schemas/build";
-import { PreferncesSchema } from "~schemas/preferences";
-import { SnapshotOptionsSchema, SnapshotSchema } from "~schemas/snapshot";
-import { Percy } from "~utils/percy-utils";
+import { CheckCircleOutlined, EditOutlined } from "@ant-design/icons"
+import {
+  Button,
+  Divider,
+  Form,
+  Input,
+  message,
+  notification,
+  Popconfirm,
+  Space,
+  Tag,
+  Tooltip,
+  Typography
+} from "antd"
+import React, { useEffect, useState } from "react"
+import { isMacOs, isWindows } from "react-device-detect"
 
-export function CaptureView() {
-    const [form] = Form.useForm()
-    const [autoCapture, SetAutoCapture] = useLocalStorage('autoCapture', false)
-    const [capturing, SetCapturing] = useState(false)
-    const [finalizing] = useLocalStorage('finalizing', false)
-    const [preferences] = useLocalStorage('preferences', PreferncesSchema.parse({}))
-    const [build] = useLocalStorage<PercyBuild>('build')
-    const [editPercyToken, SetEditPercyToken] = useState(false)
-    const actions = {
-        capture: () => {
-            SetCapturing(true)
-            form.validateFields().then(async (res) => {
-                const options = SnapshotOptionsSchema.parse(res.options)
-                await sendToContentScript({
-                    name: 'take_snapshot',
-                    body: {
-                        name: res.name,
-                        options
-                    }
-                }).then(() => {
-                    form.resetFields(['name']);
-                }).catch((err) => {
-                    console.error(err)
-                    message.error(err)
-                })
-            }).catch((err) => {
-                console.error(err)
-                message.error(err)
-            }).finally(() => {
-                SetCapturing(false)
+import { sendToBackground, sendToContentScript } from "@plasmohq/messaging"
+
+import SnapshotForm from "~components/snapshot.form"
+import { useLocalStorage, useSessionStorage } from "~hooks/use-storage"
+import type { PercyBuild } from "~schemas/build"
+import { PreferncesSchema } from "~schemas/preferences"
+import { SnapshotOptionsSchema, SnapshotSchema } from "~schemas/snapshot"
+import { Percy } from "~utils/percy-utils"
 
+export function CaptureView() {
+  const [form] = Form.useForm()
+  const [autoCapture, SetAutoCapture] = useLocalStorage("autoCapture", false)
+  const [capturing, SetCapturing] = useState(false)
+  const [finalizing] = useLocalStorage("finalizing", false)
+  const [preferences] = useLocalStorage(
+    "preferences",
+    PreferncesSchema.parse({})
+  )
+  const [build] = useLocalStorage<PercyBuild>("build")
+  const [editPercyToken, SetEditPercyToken] = useState(false)
+  const actions = {
+    capture: () => {
+      SetCapturing(true)
+      form
+        .validateFields()
+        .then(async (res) => {
+          const options = SnapshotOptionsSchema.parse(res.options)
+          await sendToContentScript({
+            name: "take_snapshot",
+            body: {
+              name: res.name,
+              options
+            }
+          })
+            .then(() => {
+              form.resetFields(["name"])
             })
-        },
-        cancelBuild: () => {
-            Percy.clearBuild()
-        },
-        viewSnapshots: () => {
-            chrome.tabs.create({
-                url: "./tabs/snapshots.html"
+            .catch((err) => {
+              console.error(err)
+              message.error(err)
             })
-        },
-        toggleCapture: () => {
-            SetAutoCapture(!autoCapture)
-        },
-        finaliseBuild: () => {
+        })
+        .catch((err) => {
+          console.error(err)
+          message.error(err)
+        })
+        .finally(() => {
+          SetCapturing(false)
+        })
+    },
+    cancelBuild: () => {
+      Percy.clearBuild()
+    },
+    viewSnapshots: () => {
+      chrome.tabs.create({
+        url: "./tabs/snapshots.html"
+      })
+    },
+    toggleCapture: () => {
+      SetAutoCapture(!autoCapture)
+    },
+    finaliseBuild: () => {
             sendToBackground({ name: 'finalize-build' }).then((res) => {
-                if (!res) {
+        if (!res) {
                     message.error("Failed to start percy. Please make sure the desktop app is running and Percy token was entered correctly.")
-                }
-            })
         }
+      })
     }
-    useEffect(() => {
-        if (preferences) {
-            form.setFieldsValue({ options: preferences.defaultSnapshotOptions })
-        }
-    }, [preferences])
+  }
+  useEffect(() => {
+    if (preferences) {
+      form.setFieldsValue({ options: preferences.defaultSnapshotOptions })
+    }
+  }, [preferences])
 
-    useEffect(() => {
-        if (editPercyToken == false && build) {
+  useEffect(() => {
+    if (editPercyToken == false && build) {
             const token = form.getFieldValue('token')
-            Percy.setToken(token)
-        }
-    }, [editPercyToken])
+      Percy.setToken(token)
+    }
+  }, [editPercyToken])
 
-    useEffect(() => {
+  useEffect(() => {
         form.setFieldValue('token', build?.token)
-    }, [build])
-    return (
-        <React.Fragment>
+  }, [build])
+  return (
+    <React.Fragment>
             <Form form={form} initialValues={{ options: preferences?.defaultSnapshotOptions, token: build?.token }} layout="vertical">
                 <Form.Item label="Percy Token" name={['token']} >
                     <Input onBlur={() => SetEditPercyToken(!editPercyToken)} addonAfter={<Button type='text' onClick={() => SetEditPercyToken(!editPercyToken)} icon={editPercyToken ? <CheckCircleOutlined /> : <EditOutlined />} />} disabled={!editPercyToken} size="large" />
-                </Form.Item>
-                <SnapshotForm />
-            </Form>
-            <Space className="w-100" direction="vertical">
-                <Tooltip title="Alt + Q">
+        </Form.Item>
+        <SnapshotForm />
+      </Form>
+      <Space className="w-100" direction="vertical">
+        <Tooltip title="Alt + Q">
                 <Button loading={capturing} onClick={actions.capture} block size="large" >Capture Snapshot</Button>
-                </Tooltip>
+        </Tooltip>
                 <Button danger={autoCapture} onClick={actions.toggleCapture} block size="large" type="primary" >{autoCapture ? "Stop Auto Capture" : "Start Auto Capture"}</Button>
-            </Space>
-            <Divider />
+      </Space>
+      <Divider />
             <Space className="w-100" direction="vertical" >
                 <Button onClick={actions.viewSnapshots} block size="large" type="dashed" >View Snapshots</Button>
                 <Button loading={finalizing} onClick={actions.finaliseBuild} block size="large" type="primary" >Finalize</Button>
                 <Popconfirm onConfirm={actions.cancelBuild} title="Clear Build?" description="Are you sure you want to Clear this build? This cannot be undone.">
                     <Button block size="large" danger type="text" >Clear Build</Button>
-                </Popconfirm>
-            </Space>
-            <Divider/>
-            <Space direction="vertical" >
-                <Typography.Title level={4} >Keyboard Shortcuts</Typography.Title>
-                <div>
-                    <Tag>Alt | ⌥</Tag> + Q : Capture Snapshot
-                </div>
-                <div>
-                    <Tag>Alt | ⌥</Tag> + W : Toggle Autocapture
-                </div>
-                <div>
-                    <Tag>Alt | ⌥</Tag> + E : View Snapshots
-                </div>
-                <div>
-                    <Tag>Alt | ⌥</Tag> + R : Open Options
-                </div>
-            </Space>
-        </React.Fragment>
-    )
-}
\ No newline at end of file
+        </Popconfirm>
+      </Space>
+      <Divider />
+      {isMacOs ? ( // Conditionally render only if user is on macOS
+        <Space direction="vertical">
+          <Typography.Title level={4}>Keyboard Shortcuts</Typography.Title>
+          <div>
+            <Tag>⌥</Tag> + Q : Capture Snapshot
+          </div>
+          <div>
+            <Tag>⌥</Tag> + W : Toggle Autocapture
+          </div>
+          <div>
+            <Tag>⌥</Tag> + E : View Snapshots
+          </div>
+          <div>
+            <Tag>⌥</Tag> + R : Open Options
+          </div>
+        </Space>
+      ) : (
+        <Space direction="vertical">
+          <Typography.Title level={4}>Keyboard Shortcuts</Typography.Title>
+          <div>
+            <Tag>Alt</Tag> + Q : Capture Snapshot
+          </div>
+          <div>
+            <Tag>Alt</Tag> + W : Toggle Autocapture
+          </div>
+          <div>
+            <Tag>Alt</Tag> + E : View Snapshots
+          </div>
+          <div>
+            <Tag>Alt</Tag> + R : Open Options
+          </div>
+        </Space>
+      )}
+    </React.Fragment>
+  )
+}