diff --git a/package-lock.json b/package-lock.json
index 4315f42d..ef6a1d71 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -11105,9 +11105,9 @@
       }
     },
     "node_modules/micromatch": {
-      "version": "4.0.7",
-      "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-4.0.7.tgz",
-      "integrity": "sha512-LPP/3KorzCwBxfeUuZmaR6bG2kdeHSbe0P2tY3FLRU4vYrjYz5hI4QZwV0njUx3jeuKe67YukQ1LSPZBKDqO/Q==",
+      "version": "4.0.8",
+      "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-4.0.8.tgz",
+      "integrity": "sha512-PXwfBhYu0hBCPw8Dn0E+WDYb7af3dSLVWKi3HGv84IdF4TyFoC0ysxFd0Goxw7nSv4T/PzEJQxsYsEiFCKo2BA==",
       "dev": true,
       "dependencies": {
         "braces": "^3.0.3",
diff --git a/src/components/UxSignals.vue b/src/components/UxSignals.vue
new file mode 100644
index 00000000..275413e0
--- /dev/null
+++ b/src/components/UxSignals.vue
@@ -0,0 +1,107 @@
+<template>
+  <div class="uxsignals-wrapper" data-uxsignals-embed="panel-ikxmf8p595" :data-uxsignals-mode="mode"></div>
+</template>
+
+<script>
+export default {
+  name: 'UxSignals',
+
+  computed: {
+    mode() {
+      return import.meta.env.PROD ? '' : 'demo';
+    },
+  },
+
+  mounted() {
+    const uxSignalsScript = document.createElement('script');
+    uxSignalsScript.async = true;
+    uxSignalsScript.src = 'https://uxsignals-frontend.uxsignals.app.iterate.no/embed.js';
+    document.head.appendChild(uxSignalsScript);
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+@use '@/styles/colors' as *;
+@use '@/styles/variables' as *;
+
+.uxsignals-wrapper {
+  flex: 2 1 800px;
+}
+
+:deep(.uxsignals-container) {
+  margin: 1rem;
+  padding: 1.5rem;
+  color: $color-purple;
+  font-family: 'OsloSans', serif !important;
+  background-color: #ffffff;
+  border: 3px solid #dae3e5;
+  border-radius: 0;
+
+  @media screen and (min-width: $break-md) {
+    margin-right: 1.5rem;
+    margin-left: 1.5rem;
+  }
+
+  @media screen and (min-width: $break-lg) {
+    margin-right: 2rem;
+    margin-left: 2rem;
+  }
+}
+
+:deep(.uxsignals-embed > div) {
+  padding: 0;
+}
+
+:deep(.uxsignals-header) {
+  h2 {
+    font-weight: 500;
+    font-size: $font-large;
+  }
+}
+
+:deep(.uxsignals-description) {
+  p {
+    font-size: $font-body;
+  }
+}
+
+:deep(.uxsignals-cta-container) {
+  margin: 0;
+
+  button {
+    padding: 16px;
+    color: #ffffff;
+    background-color: $color-purple;
+    border-radius: 0;
+
+    span {
+      font-weight: 500;
+      font-size: $font-body;
+    }
+
+    &:hover {
+      background-color: #1f42aa;
+      outline: 0;
+
+      span {
+        text-decoration: underline;
+        text-underline-offset: 0.3em;
+      }
+    }
+
+    &:focus {
+      background-color: #1f42aa;
+      outline-color: #e0adff;
+    }
+
+    &:active {
+      outline: 0;
+
+      span {
+        text-decoration: none;
+      }
+    }
+  }
+}
+</style>
diff --git a/src/views/District.vue b/src/views/District.vue
index c0cab75b..6763e042 100644
--- a/src/views/District.vue
+++ b/src/views/District.vue
@@ -1,5 +1,7 @@
 <template>
   <div class="main-container">
+    <ux-signals />
+
     <div class="main-container__cards main-container__cards--district">
       <div class="topics-grid">
         <v-category
@@ -24,15 +26,18 @@
 import { mapState, mapGetters } from 'vuex';
 import VCategory from '@/components/VCategory.vue';
 import VLeaflet from '@/components/VLeaflet.vue';
+import UxSignals from '@/components/UxSignals.vue';
 import { topics, topicNames } from '@/config/topics';
 import districts from '@/config/geoData/districts';
 import { getDistrictName } from '@/util';
 
 export default {
   name: 'District',
+
   components: {
     VCategory,
     VLeaflet,
+    UxSignals,
   },
 
   props: {
diff --git a/src/views/__tests__/__snapshots__/district.spec.js.snap b/src/views/__tests__/__snapshots__/district.spec.js.snap
index b054587e..bbb77529 100644
--- a/src/views/__tests__/__snapshots__/district.spec.js.snap
+++ b/src/views/__tests__/__snapshots__/district.spec.js.snap
@@ -4,6 +4,7 @@ exports[`Bydel renders component correctly 1`] = `
 <div
   class="main-container"
 >
+  <ux-signals-stub />
   <div
     class="main-container__cards main-container__cards--district"
   >
diff --git a/src/views/__tests__/district.spec.js b/src/views/__tests__/district.spec.js
index 7c08f690..058f9fff 100644
--- a/src/views/__tests__/district.spec.js
+++ b/src/views/__tests__/district.spec.js
@@ -23,6 +23,7 @@ describe('Bydel', () => {
         plugins: [router, store, i18n],
         stubs: {
           VLeaflet: true,
+          UxSignals: true,
         },
       },
       props: {