diff --git a/.env.sample b/.env.sample
index 46fb30a..0a6cabc 100644
--- a/.env.sample
+++ b/.env.sample
@@ -6,3 +6,9 @@ YANDEX_METRIKA_ID=
 
 # App base URL
 BASE_URL="https://editorjs.io"
+
+# Notion database id
+NOTION_DATABASE_ID=
+
+# Notion client secret
+NOTION_CLIENT_SECRET=
diff --git a/app.vue b/app.vue
index 3c744c3..af185d6 100644
--- a/app.vue
+++ b/app.vue
@@ -35,9 +35,11 @@
     <Join/>
   </Section>
   <LayoutFooter />
+  <Surveys/>
 </template>
 
 <script lang="ts" setup>
+
 const config = useRuntimeConfig();
 
 useServerSeoMeta({
@@ -48,6 +50,7 @@ useServerSeoMeta({
   ogImage: config.baseUrl + '/og-image.png',
   twitterCard: 'summary_large_image',
 })
+
 </script>
 
 <style>
diff --git a/components/Surveys.vue b/components/Surveys.vue
new file mode 100644
index 0000000..93576cd
--- /dev/null
+++ b/components/Surveys.vue
@@ -0,0 +1,56 @@
+<template/>
+<script>
+import { CodeXSurveys } from '@codexteam/surveys';
+
+const databaseId = process.env.NOTION_DATABASE_ID;
+const clientSecret = process.env.NOTION_CLIENT_SECRET;
+
+const widget = new CodeXSurveys({
+  notion: {
+    databaseId: databaseId,
+    clientSecret: clientSecret,
+  },
+  form: {
+    description:
+      'We want to better understand your goals and requirements. Please, provide us some insights.',
+    items: [
+      {
+        label: 'Product type',
+        field: {
+          name: 'product_type',
+          type: 'select',
+          options: ['B2B', 'B2C'],
+        },
+      },
+      {
+        label: 'Your product size',
+        field: {
+          type: 'select',
+          name: 'product_size',
+          options: ['<100 DAU', '100 DAU - 1000 DAU', '> 1000 DAU'],
+        },
+      },
+      {
+        label: 'Your software license',
+        field: {
+          name: 'software_license',
+          type: 'select',
+          options: ['Freeware / Open-Source', 'Permissive', 'Proprietary'],
+        },
+      },
+      {
+        label: 'Your suggestions to the Editor.js',
+        field: {
+          name: 'suggestions',
+          type: 'textarea',
+          placeholder: 'Enter your ideas, requests or issues',
+        },
+      },
+    ],
+  },
+  widget: {
+    title: 'Using Editor.js?',
+    description: 'Take a 2-minutes survey🙏',
+  },
+});
+</script>
diff --git a/package.json b/package.json
index fccff39..24034c8 100644
--- a/package.json
+++ b/package.json
@@ -22,6 +22,7 @@
   "dependencies": {
     "@amplitude/analytics-browser": "^1.6.6",
     "@codexteam/nuxt-icons": "^0.0.4",
+    "@codexteam/surveys": "^0.0.4",
     "@editorjs/checklist": "^1.4.0",
     "@editorjs/code": "^2.8.0",
     "@editorjs/delimiter": "^1.3.0",
diff --git a/yarn.lock b/yarn.lock
index 5c33e61..863f050 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -1745,6 +1745,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@codexteam/surveys@npm:^0.0.4":
+  version: 0.0.4
+  resolution: "@codexteam/surveys@npm:0.0.4"
+  checksum: ce00ad3f5650160526b8abacad38afc69a02f307071c33bc4a6542c294abe8d8a4aab263cf07778936c2683a445508d3f68cd26bbc0a6d83fa8228bfd8d665e1
+  languageName: node
+  linkType: hard
+
 "@csstools/postcss-cascade-layers@npm:^1.1.1":
   version: 1.1.1
   resolution: "@csstools/postcss-cascade-layers@npm:1.1.1"
@@ -9036,6 +9043,7 @@ __metadata:
   dependencies:
     "@amplitude/analytics-browser": ^1.6.6
     "@codexteam/nuxt-icons": ^0.0.4
+    "@codexteam/surveys": ^0.0.4
     "@editorjs/checklist": ^1.4.0
     "@editorjs/code": ^2.8.0
     "@editorjs/delimiter": ^1.3.0