diff --git a/.eslintrc b/.eslintrc
index fd18713..3ed345c 100644
--- a/.eslintrc
+++ b/.eslintrc
@@ -1,6 +1,10 @@
 {
-  "extends": ["@antfu", "plugin:tailwindcss/recommended"],
+  "extends": ["@antfu", "prettier", "plugin:tailwindcss/recommended"],
+  "plugins": ["prettier"],
   "rules": {
+    "prettier/prettier": "error",
+    "antfu/if-newline": "off",
+    "no-console": "off",
     "tailwindcss/classnames-order": "error",
     "tailwindcss/no-custom-classname": "off"
   }
diff --git a/.prettierignore b/.prettierignore
deleted file mode 100644
index 4346006..0000000
--- a/.prettierignore
+++ /dev/null
@@ -1,7 +0,0 @@
-*.ts
-*.js
-*.vue
-*.cts
-*.cjs
-*.mjs
-*.mts
diff --git a/.prettierrc b/.prettierrc
new file mode 100644
index 0000000..12bd349
--- /dev/null
+++ b/.prettierrc
@@ -0,0 +1,5 @@
+{
+  "printWidth": 80,
+  "semi": false,
+  "singleQuote": true
+}
diff --git a/.vscode/extensions.json b/.vscode/extensions.json
index 0955b7b..b0cafa8 100644
--- a/.vscode/extensions.json
+++ b/.vscode/extensions.json
@@ -4,7 +4,10 @@
     "ZixuanChen.vitest-explorer",
     "bradlc.vscode-tailwindcss",
     "vue.volar",
+    "vue.vscode-typescript-vue-plugin",
     "dbaeumer.vscode-eslint",
-    "EditorConfig.EditorConfig"
+    "EditorConfig.EditorConfig",
+    "esbenp.prettier-vscode",
+    "gruntfuggly.todo-tree"
   ]
 }
diff --git a/.vscode/settings.json b/.vscode/settings.json
index 3c9b8f9..0d3a563 100644
--- a/.vscode/settings.json
+++ b/.vscode/settings.json
@@ -3,12 +3,10 @@
   "editor.codeActionsOnSave": {
     "source.fixAll.eslint": true
   },
-  "editor.formatOnSave": false,
+  "editor.formatOnSave": true,
   "css.lint.unknownAtRules": "ignore",
   "i18n-ally.dirStructure": "file",
-  "i18n-ally.localesPaths": [
-    "src/i18n"
-  ],
+  "i18n-ally.localesPaths": ["src/i18n"],
   "i18n-ally.keystyle": "nested",
   "i18n-ally.sourceLanguage": "ru"
 }
diff --git a/package-lock.json b/package-lock.json
index 7d85edf..e8a1e55 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -21,10 +21,13 @@
         "@vue/test-utils": "^2.3.2",
         "autoprefixer": "^10.4.14",
         "eslint": "^8.38.0",
+        "eslint-config-prettier": "^8.8.0",
+        "eslint-plugin-prettier": "^4.2.1",
         "eslint-plugin-tailwindcss": "^3.11.0",
         "happy-dom": "^9.8.0",
         "lint-staged": "^13.2.1",
         "postcss": "^8.4.22",
+        "prettier": "^2.8.8",
         "simple-git-hooks": "^2.8.1",
         "tailwindcss": "^3.3.1",
         "taze": "^0.9.1",
@@ -3529,6 +3532,18 @@
         "url": "https://opencollective.com/eslint"
       }
     },
+    "node_modules/eslint-config-prettier": {
+      "version": "8.8.0",
+      "resolved": "https://registry.npmjs.org/eslint-config-prettier/-/eslint-config-prettier-8.8.0.tgz",
+      "integrity": "sha512-wLbQiFre3tdGgpDv67NQKnJuTlcUVYHas3k+DZCc2U2BadthoEY4B7hLPvAxaqdyOGCzuLfii2fqGph10va7oA==",
+      "dev": true,
+      "bin": {
+        "eslint-config-prettier": "bin/cli.js"
+      },
+      "peerDependencies": {
+        "eslint": ">=7.0.0"
+      }
+    },
     "node_modules/eslint-import-resolver-node": {
       "version": "0.3.7",
       "resolved": "https://registry.npmjs.org/eslint-import-resolver-node/-/eslint-import-resolver-node-0.3.7.tgz",
@@ -3816,6 +3831,27 @@
         "node": ">=5.0.0"
       }
     },
+    "node_modules/eslint-plugin-prettier": {
+      "version": "4.2.1",
+      "resolved": "https://registry.npmjs.org/eslint-plugin-prettier/-/eslint-plugin-prettier-4.2.1.tgz",
+      "integrity": "sha512-f/0rXLXUt0oFYs8ra4w49wYZBG5GKZpAYsJSm6rnYL5uVDjd+zowwMwVZHnAjf4edNrKpCDYfXDgmRE/Ak7QyQ==",
+      "dev": true,
+      "dependencies": {
+        "prettier-linter-helpers": "^1.0.0"
+      },
+      "engines": {
+        "node": ">=12.0.0"
+      },
+      "peerDependencies": {
+        "eslint": ">=7.28.0",
+        "prettier": ">=2.0.0"
+      },
+      "peerDependenciesMeta": {
+        "eslint-config-prettier": {
+          "optional": true
+        }
+      }
+    },
     "node_modules/eslint-plugin-promise": {
       "version": "6.1.1",
       "resolved": "https://registry.npmjs.org/eslint-plugin-promise/-/eslint-plugin-promise-6.1.1.tgz",
@@ -7200,6 +7236,33 @@
         "node": ">= 0.8.0"
       }
     },
+    "node_modules/prettier": {
+      "version": "2.8.8",
+      "resolved": "https://registry.npmjs.org/prettier/-/prettier-2.8.8.tgz",
+      "integrity": "sha512-tdN8qQGvNjw4CHbY+XXk0JgCXn9QiF21a55rBe5LJAU+kDyC4WQn4+awm2Xfk2lQMk5fKup9XgzTZtGkjBdP9Q==",
+      "dev": true,
+      "bin": {
+        "prettier": "bin-prettier.js"
+      },
+      "engines": {
+        "node": ">=10.13.0"
+      },
+      "funding": {
+        "url": "https://github.com/prettier/prettier?sponsor=1"
+      }
+    },
+    "node_modules/prettier-linter-helpers": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/prettier-linter-helpers/-/prettier-linter-helpers-1.0.0.tgz",
+      "integrity": "sha512-GbK2cP9nraSSUF9N2XwUwqfzlAFlMNYYl+ShE/V+H8a9uNl/oUqB1w2EL54Jh0OlyRSd8RfWYJ3coVS4TROP2w==",
+      "dev": true,
+      "dependencies": {
+        "fast-diff": "^1.1.2"
+      },
+      "engines": {
+        "node": ">=6.0.0"
+      }
+    },
     "node_modules/pretty-format": {
       "version": "27.5.1",
       "resolved": "https://registry.npmjs.org/pretty-format/-/pretty-format-27.5.1.tgz",
diff --git a/package.json b/package.json
index 1ed530d..8ae029c 100644
--- a/package.json
+++ b/package.json
@@ -27,10 +27,13 @@
     "@vue/test-utils": "^2.3.2",
     "autoprefixer": "^10.4.14",
     "eslint": "^8.38.0",
+    "eslint-config-prettier": "^8.8.0",
+    "eslint-plugin-prettier": "^4.2.1",
     "eslint-plugin-tailwindcss": "^3.11.0",
     "happy-dom": "^9.8.0",
     "lint-staged": "^13.2.1",
     "postcss": "^8.4.22",
+    "prettier": "^2.8.8",
     "simple-git-hooks": "^2.8.1",
     "tailwindcss": "^3.3.1",
     "taze": "^0.9.1",
diff --git a/src/App.vue b/src/App.vue
index 8e2a8f1..f796221 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -16,36 +16,46 @@ function toggleLocale() {
 
   if (!(indexOfCurrentLocale < availableLocales.length - 1))
     localeStore.value = availableLocales[0]
-
-  else
-    localeStore.value = availableLocales[indexOfCurrentLocale + 1]
+  else localeStore.value = availableLocales[indexOfCurrentLocale + 1]
 }
 </script>
 
 <template>
-  <div class="m-auto flex min-h-[100vh] max-w-2xl flex-col items-center justify-center p-4 text-center font-sans">
+  <div
+    class="m-auto flex min-h-[100vh] max-w-2xl flex-col items-center justify-center p-4 text-center font-sans"
+  >
     <header class="flex flex-wrap items-center justify-center gap-4">
-      <h1>
-        Tailvue
-      </h1>
+      <h1>Tailvue</h1>
     </header>
     <main class="flex flex-col items-center gap-4">
       <section>
         <p data-testId="aboutParagraph">
-          {{ $t("about") }}
+          {{ $t('about') }}
         </p>
       </section>
 
       <div class="flex gap-4">
-        <a href="https://github.com/SeryiBaran/tailvue-starter" target="_blank" class="btn icon-button">
+        <a
+          href="https://github.com/SeryiBaran/tailvue-starter"
+          target="_blank"
+          class="btn icon-button"
+        >
           <IconMdiGithub class="icon" />
         </a>
 
-        <button class="btn icon-button" data-testId="toggleDarkBtn" @click="toggleDark()">
+        <button
+          class="btn icon-button"
+          data-testId="toggleDarkBtn"
+          @click="toggleDark()"
+        >
           <IconMdiThemeLightDark class="icon" />
         </button>
 
-        <button data-testId="toggleLocaleBtn" class="btn icon-button" @click="toggleLocale()">
+        <button
+          data-testId="toggleLocaleBtn"
+          class="btn icon-button"
+          @click="toggleLocale()"
+        >
           <IconMdiTranslate class="icon" />
         </button>
       </div>
diff --git a/src/__tests__/i18n.spec.ts b/src/__tests__/i18n.spec.ts
index 0550dc9..c2e801b 100644
--- a/src/__tests__/i18n.spec.ts
+++ b/src/__tests__/i18n.spec.ts
@@ -16,13 +16,21 @@ describe('I18n', async () => {
       },
     })
 
-    const locales = Object.keys(config.messages) as Array<keyof typeof config.messages>
+    const locales = Object.keys(config.messages) as Array<
+      keyof typeof config.messages
+    >
 
     for (let index = 0; index < locales.length + 1; index++) {
       if (index !== 0)
-        await wrapper.find('button[data-testId="toggleLocaleBtn"]').trigger('click')
+        await wrapper
+          .find('button[data-testId="toggleLocaleBtn"]')
+          .trigger('click')
 
-      expect(wrapper.find('p[data-testId="aboutParagraph"]').text()).toBe(config.messages[index > locales.length - 1 ? locales[0] : locales[index]].about)
+      expect(wrapper.find('p[data-testId="aboutParagraph"]').text()).toBe(
+        config.messages[
+          index > locales.length - 1 ? locales[0] : locales[index]
+        ].about
+      )
     }
   })
 })
diff --git a/tailwind.config.cjs b/tailwind.config.cjs
index 7b9d311..5e60d3a 100644
--- a/tailwind.config.cjs
+++ b/tailwind.config.cjs
@@ -2,10 +2,7 @@
 
 module.exports = {
   darkMode: 'class',
-  content: [
-    './index.html',
-    './src/**/*.{vue,js,ts,jsx,tsx}',
-  ],
+  content: ['./index.html', './src/**/*.{vue,js,ts,jsx,tsx}'],
   theme: {
     extend: {
       fontFamily: {
diff --git a/tsconfig.json b/tsconfig.json
index 23e0b8e..be71c78 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -3,10 +3,7 @@
     "baseUrl": ".",
     "module": "ESNext",
     "target": "es2016",
-    "lib": [
-      "DOM",
-      "ESNext"
-    ],
+    "lib": ["DOM", "ESNext"],
     "strict": true,
     "jsx": "preserve",
     "esModuleInterop": true,
@@ -18,18 +15,9 @@
     "allowJs": true,
     "forceConsistentCasingInFileNames": true,
     "paths": {
-      "@/*": [
-        "./src/*"
-      ]
+      "@/*": ["./src/*"]
     }
   },
-  "include": [
-    "env.d.ts",
-    "./src/**/*"
-  ],
-  "exclude": [
-    "dist",
-    "node_modules",
-    "*.cjs"
-  ]
+  "include": ["env.d.ts", "./src/**/*"],
+  "exclude": ["dist", "node_modules", "*.cjs"]
 }
diff --git a/vite.config.ts b/vite.config.ts
index e0e296c..a219832 100644
--- a/vite.config.ts
+++ b/vite.config.ts
@@ -10,10 +10,7 @@ export default defineConfig({
       '@/': `${path.resolve(__dirname, 'src')}/`,
     },
   },
-  plugins: [
-    Vue(),
-    Icons({ compiler: 'vue3' }),
-  ],
+  plugins: [Vue(), Icons({ compiler: 'vue3' })],
   test: {
     environment: 'happy-dom',
   },