diff --git a/src/main/IPCs.ts b/src/main/IPCs.ts
index 0ec519c..7792378 100644
--- a/src/main/IPCs.ts
+++ b/src/main/IPCs.ts
@@ -1,4 +1,4 @@
-import { ipcMain, shell, IpcMainEvent } from 'electron'
+import { ipcMain, shell, IpcMainEvent, dialog } from 'electron'
 import Constants from './utils/Constants'
 
 /*
@@ -15,5 +15,21 @@ export default class IPCs {
     ipcMain.on('msgOpenExternalLink', async (event: IpcMainEvent, url: string) => {
       await shell.openExternal(url)
     })
+
+    // Open file
+    ipcMain.handle('msgOpenFile', async (event, filter: string) => {
+      const filters = []
+      if (filter === 'text') {
+        filters.push({ name: 'Text', extensions: ['txt', 'json'] })
+      }
+      if (filter === 'zip') {
+        filters.push({ name: 'Zip', extensions: ['zip'] })
+      }
+      const dialogResult = await dialog.showOpenDialog({
+        properties: ['openFile'],
+        filters
+      })
+      return dialogResult
+    })
   }
 }
diff --git a/src/preload/index.ts b/src/preload/index.ts
index 333caa9..218ae9a 100644
--- a/src/preload/index.ts
+++ b/src/preload/index.ts
@@ -1,7 +1,7 @@
 import { contextBridge, ipcRenderer, IpcRendererEvent } from 'electron'
 
 // Whitelist of valid channels used for IPC communication (Send message from Renderer to Main)
-const mainAvailChannels: string[] = ['msgRequestGetVersion', 'msgOpenExternalLink']
+const mainAvailChannels: string[] = ['msgRequestGetVersion', 'msgOpenExternalLink', 'msgOpenFile']
 const rendererAvailChannels: string[] = []
 
 contextBridge.exposeInMainWorld('mainApi', {
diff --git a/src/renderer/locales/en.json b/src/renderer/locales/en.json
index 50ce555..c57a3ff 100644
--- a/src/renderer/locales/en.json
+++ b/src/renderer/locales/en.json
@@ -2,7 +2,8 @@
   "desc": {
     "welcome-title": "Hello Vutron! Everything is ready.",
     "welcome-desc": "You can now write cross-platform web applications. See changes in real time and build to multiple platforms with one command. If you're not already familiar with it, you can get help from the documentation page below, or run some pre-written example code.",
-    "second-desc": "You have moved to the second screen! There is nothing here!"
+    "second-desc": "You have moved to the second screen! There is nothing here!",
+    "selected-file": "Selected file: {filePath}."
   },
   "title": {
     "main": "Main Screen",
@@ -14,6 +15,7 @@
     "change-language": "Change Language",
     "increase-count": "Count 1 increment",
     "documentation": "Documentation",
-    "github": "Source Code"
+    "github": "Source Code",
+    "open-file": "Open a text file"
   }
 }
diff --git a/src/renderer/locales/nl.json b/src/renderer/locales/nl.json
index 4bb360b..9cc7065 100644
--- a/src/renderer/locales/nl.json
+++ b/src/renderer/locales/nl.json
@@ -2,7 +2,8 @@
   "desc": {
     "welcome-title": "Hallo Vutron! Alles is klaar.",
     "welcome-desc": "U kunt nu platformonafhankelijke webapplicaties schrijven. Bekijk wijzigingen in realtime en bouw met één opdracht naar meerdere platforms. Als u hiermee nog niet bekend bent, kunt u hulp krijgen via de onderstaande documentatiepagina, of een vooraf geschreven voorbeeldcode uitvoeren.",
-    "second-desc": "U bent naar het tweede scherm gegaan! Hier is niks!"
+    "second-desc": "U bent naar het tweede scherm gegaan! Hier is niks!",
+    "selected-file": "Geselecteerde bestand: {filePath}."
   },
   "title": {
     "main": "Hoofdscherm",
@@ -14,6 +15,7 @@
     "change-language": "Taal wijzigen",
     "increase-count": "Één stap optellen",
     "documentation": "Documentatie",
-    "github": "Broncode"
+    "github": "Broncode",
+    "open-file": "Open een bestand"
   }
 }
diff --git a/src/renderer/screens/MainScreen.vue b/src/renderer/screens/MainScreen.vue
index 1ec53b0..16403d7 100644
--- a/src/renderer/screens/MainScreen.vue
+++ b/src/renderer/screens/MainScreen.vue
@@ -1,7 +1,7 @@
 <script setup lang="tsx">
 import { useI18n } from 'vue-i18n'
 import { useTheme } from 'vuetify'
-import { openExternal } from '@/renderer/utils'
+import { openExternal, openFile } from '@/renderer/utils'
 import { useCounterStore } from '@/renderer/store/counter'
 import { storeToRefs } from 'pinia'
 import { onMounted, ref } from 'vue'
@@ -12,6 +12,7 @@ const { counter } = storeToRefs(useCounterStore())
 const theme = useTheme()
 const languages = ref(['en'])
 const appVersion = ref('Unknown')
+const selectedFile = ref('')
 
 onMounted((): void => {
   languages.value = availableLocales
@@ -43,6 +44,13 @@ const handleOpenGitHub = async (): Promise<void> => {
 const handleCountIncrease = (): void => {
   counterIncrease(1)
 }
+
+const handleOpenFile = async () => {
+  const dialogResult = await openFile('text')
+  if (!dialogResult.canceled) {
+    selectedFile.value = dialogResult.filePaths[0]
+  }
+}
 </script>
 
 <template>
@@ -63,8 +71,13 @@ const handleCountIncrease = (): void => {
         <p class="my-4">
           App Version: <strong>{{ appVersion }}</strong>
         </p>
+          <p v-if="selectedFile !== ''">{{
+                  $t('desc.selected-file', {
+                    filePath: selectedFile
+                  })
+                }}</p>
         <v-row class="my-4">
-          <v-col cols="3">
+          <v-col>
             <v-btn icon color="primary" @click="handleChangeTheme">
               <v-icon icon="mdi-brightness-6" />
               <v-tooltip activator="parent" location="bottom">
@@ -72,7 +85,7 @@ const handleCountIncrease = (): void => {
               </v-tooltip>
             </v-btn>
           </v-col>
-          <v-col cols="3">
+          <v-col>
             <v-badge data-testid="counter-badge" color="blue" :content="counter">
               <v-btn data-testid="btn-counter" icon color="primary" @click="handleCountIncrease">
                 <v-icon icon="mdi-plus-circle" />
@@ -82,7 +95,7 @@ const handleCountIncrease = (): void => {
               </v-btn>
             </v-badge>
           </v-col>
-          <v-col cols="3">
+          <v-col>
             <v-btn icon color="primary" @click="handleOpenDocument">
               <v-icon icon="mdi-file-document" />
               <v-tooltip activator="parent" location="bottom">
@@ -90,7 +103,7 @@ const handleCountIncrease = (): void => {
               </v-tooltip>
             </v-btn>
           </v-col>
-          <v-col cols="3">
+          <v-col>
             <v-btn icon color="primary" @click="handleOpenGitHub">
               <v-icon icon="mdi-github" />
               <v-tooltip activator="parent" location="bottom">
@@ -98,9 +111,17 @@ const handleCountIncrease = (): void => {
               </v-tooltip>
             </v-btn>
           </v-col>
+          <v-col>
+            <v-btn icon color="primary" @click="handleOpenFile">
+              <v-icon icon="mdi-folder-open" />
+              <v-tooltip activator="parent" location="bottom">
+                {{ $t('menu.open-file') }}
+              </v-tooltip>
+            </v-btn>
+          </v-col>
           <v-col cols="12">
             <v-select
-              data-testid="select-language"
+data-testid="select-language"
               :model-value="locale"
               density="compact"
               :label="$t('menu.change-language')"
diff --git a/src/renderer/utils/index.ts b/src/renderer/utils/index.ts
index aea916e..28228f2 100644
--- a/src/renderer/utils/index.ts
+++ b/src/renderer/utils/index.ts
@@ -6,6 +6,10 @@ export default class Utils {
   static async openExternal(url: string): Promise<void> {
     await window.mainApi.send('msgOpenExternalLink', url)
   }
+
+  static async openFile(type: string): Promise<any> {
+    return window.mainApi.invoke('msgOpenFile', type)
+  }
 }
 
-export const { getCurrentLocale, openExternal } = Utils
+export const { getCurrentLocale, openExternal, openFile } = Utils