diff --git a/api/app.js b/api/app.js
index d1b42fd35..f1fe5aed5 100644
--- a/api/app.js
+++ b/api/app.js
@@ -12,6 +12,8 @@ module.exports = async function (fastify, opts) {
     server.register(require('./routes/v1/application/deploy'), { prefix: '/application/deploy' })
     server.register(require('./routes/v1/application/deploy/logs'), { prefix: '/application/deploy/logs' })
     server.register(require('./routes/v1/databases'), { prefix: '/databases' })
+    server.register(require('./routes/v1/services'), { prefix: '/services' })
+    server.register(require('./routes/v1/services/deploy'), { prefix: '/services/deploy' })
     server.register(require('./routes/v1/server'), { prefix: '/server' })
   })
   // Public routes
diff --git a/api/libs/applications/configuration.js b/api/libs/applications/configuration.js
index 53b913feb..134599a76 100644
--- a/api/libs/applications/configuration.js
+++ b/api/libs/applications/configuration.js
@@ -2,7 +2,7 @@ const { uniqueNamesGenerator, adjectives, colors, animals } = require('unique-na
 const cuid = require('cuid')
 const crypto = require('crypto')
 const { docker } = require('../docker')
-const { execShellAsync } = require('../common')
+const { execShellAsync, baseServiceConfiguration } = require('../common')
 
 function getUniq () {
   return uniqueNamesGenerator({ dictionaries: [adjectives, animals, colors], length: 2 })
@@ -15,25 +15,6 @@ function setDefaultConfiguration (configuration) {
   const shaBase = JSON.stringify({ repository: configuration.repository })
   const sha256 = crypto.createHash('sha256').update(shaBase).digest('hex')
 
-  const baseServiceConfiguration = {
-    replicas: 1,
-    restart_policy: {
-      condition: 'any',
-      max_attempts: 3
-    },
-    update_config: {
-      parallelism: 1,
-      delay: '10s',
-      order: 'start-first'
-    },
-    rollback_config: {
-      parallelism: 1,
-      delay: '10s',
-      order: 'start-first',
-      failure_action: 'rollback'
-    }
-  }
-
   configuration.build.container.name = sha256.slice(0, 15)
 
   configuration.general.nickname = nickname
@@ -133,4 +114,4 @@ async function precheckDeployment ({ services, configuration }) {
     forceUpdate
   }
 }
-module.exports = { setDefaultConfiguration, updateServiceLabels, precheckDeployment }
+module.exports = { setDefaultConfiguration, updateServiceLabels, precheckDeployment, baseServiceConfiguration }
diff --git a/api/libs/common.js b/api/libs/common.js
index 6026af14b..0225e8224 100644
--- a/api/libs/common.js
+++ b/api/libs/common.js
@@ -6,6 +6,24 @@ const User = require('../models/User')
 const algorithm = 'aes-256-cbc'
 const key = process.env.SECRETS_ENCRYPTION_KEY
 
+const baseServiceConfiguration = {
+  replicas: 1,
+  restart_policy: {
+    condition: 'any',
+    max_attempts: 3
+  },
+  update_config: {
+    parallelism: 1,
+    delay: '10s',
+    order: 'start-first'
+  },
+  rollback_config: {
+    parallelism: 1,
+    delay: '10s',
+    order: 'start-first',
+    failure_action: 'rollback'
+  }
+}
 function delay (t) {
   return new Promise(function (resolve) {
     setTimeout(function () {
@@ -94,5 +112,6 @@ module.exports = {
   checkImageAvailable,
   encryptData,
   decryptData,
-  verifyUserId
+  verifyUserId,
+  baseServiceConfiguration
 }
diff --git a/api/libs/services/plausible/index.js b/api/libs/services/plausible/index.js
new file mode 100644
index 000000000..7e8c61fcc
--- /dev/null
+++ b/api/libs/services/plausible/index.js
@@ -0,0 +1,185 @@
+const { execShellAsync, cleanupTmp, baseServiceConfiguration } = require('../../common')
+const yaml = require('js-yaml')
+const fs = require('fs').promises
+const generator = require('generate-password')
+const { docker } = require('../../docker')
+
+async function plausible ({ email, userName, userPassword, baseURL, traefikURL }) {
+  const deployId = 'plausible'
+  const workdir = '/tmp/plausible'
+  const secretKey = generator.generate({ length: 64, numbers: true, strict: true })
+  const generateEnvsPostgres = {
+    POSTGRESQL_PASSWORD: generator.generate({ length: 24, numbers: true, strict: true }),
+    POSTGRESQL_USERNAME: generator.generate({ length: 10, numbers: true, strict: true }),
+    POSTGRESQL_DATABASE: 'plausible'
+  }
+
+  const secrets = [
+    { name: 'ADMIN_USER_EMAIL', value: email },
+    { name: 'ADMIN_USER_NAME', value: userName },
+    { name: 'ADMIN_USER_PWD', value: userPassword },
+    { name: 'BASE_URL', value: baseURL },
+    { name: 'SECRET_KEY_BASE', value: secretKey },
+    { name: 'DISABLE_AUTH', value: 'false' },
+    { name: 'DISABLE_REGISTRATION', value: 'true' },
+    { name: 'DATABASE_URL', value: `postgresql://${generateEnvsPostgres.POSTGRESQL_USERNAME}:${generateEnvsPostgres.POSTGRESQL_PASSWORD}@plausible_db:5432/${generateEnvsPostgres.POSTGRESQL_DATABASE}` },
+    { name: 'CLICKHOUSE_DATABASE_URL', value: 'http://plausible_events_db:8123/plausible' }
+  ]
+
+  const generateEnvsClickhouse = {}
+  for (const secret of secrets) generateEnvsClickhouse[secret.name] = secret.value
+
+  const clickhouseConfigXml = `
+    <yandex>
+      <logger>
+          <level>warning</level>
+          <console>true</console>
+      </logger>
+
+      <!-- Stop all the unnecessary logging -->
+      <query_thread_log remove="remove"/>
+      <query_log remove="remove"/>
+      <text_log remove="remove"/>
+      <trace_log remove="remove"/>
+      <metric_log remove="remove"/>
+      <asynchronous_metric_log remove="remove"/>
+  </yandex>`
+  const clickhouseUserConfigXml = `
+    <yandex>
+      <profiles>
+          <default>
+              <log_queries>0</log_queries>
+              <log_query_threads>0</log_query_threads>
+          </default>
+      </profiles>
+  </yandex>`
+
+  const clickhouseConfigs = [
+    { source: 'plausible-clickhouse-user-config.xml', target: '/etc/clickhouse-server/users.d/logging.xml' },
+    { source: 'plausible-clickhouse-config.xml', target: '/etc/clickhouse-server/config.d/logging.xml' },
+    { source: 'plausible-init.query', target: '/docker-entrypoint-initdb.d/init.query' },
+    { source: 'plausible-init-db.sh', target: '/docker-entrypoint-initdb.d/init-db.sh' }
+  ]
+
+  const initQuery = 'CREATE DATABASE IF NOT EXISTS plausible;'
+  const initScript = 'clickhouse client --queries-file /docker-entrypoint-initdb.d/init.query'
+  await execShellAsync(`mkdir -p ${workdir}`)
+  await fs.writeFile(`${workdir}/clickhouse-config.xml`, clickhouseConfigXml)
+  await fs.writeFile(`${workdir}/clickhouse-user-config.xml`, clickhouseUserConfigXml)
+  await fs.writeFile(`${workdir}/init.query`, initQuery)
+  await fs.writeFile(`${workdir}/init-db.sh`, initScript)
+  const stack = {
+    version: '3.8',
+    services: {
+      [deployId]: {
+        image: 'plausible/analytics:latest',
+        command: 'sh -c "sleep 10 && /entrypoint.sh db createdb && /entrypoint.sh db migrate && /entrypoint.sh db init-admin && /entrypoint.sh run"',
+        networks: [`${docker.network}`],
+        volumes: [`${deployId}-postgres-data:/var/lib/postgresql/data`],
+        environment: generateEnvsClickhouse,
+        deploy: {
+          ...baseServiceConfiguration,
+          labels: [
+            'managedBy=coolify',
+            'type=service',
+            'serviceName=plausible',
+            'configuration=' + JSON.stringify({ email, userName, userPassword, baseURL, secretKey, generateEnvsPostgres, generateEnvsClickhouse }),
+            'traefik.enable=true',
+            'traefik.http.services.' +
+            deployId +
+            '.loadbalancer.server.port=8000',
+            'traefik.http.routers.' +
+            deployId +
+            '.entrypoints=websecure',
+            'traefik.http.routers.' +
+            deployId +
+            '.rule=Host(`' +
+            traefikURL +
+            '`) && PathPrefix(`/`)',
+            'traefik.http.routers.' +
+            deployId +
+            '.tls.certresolver=letsencrypt',
+            'traefik.http.routers.' +
+            deployId +
+            '.middlewares=global-compress'
+          ]
+        }
+      },
+      plausible_db: {
+        image: 'bitnami/postgresql:13.2.0',
+        networks: [`${docker.network}`],
+        environment: generateEnvsPostgres,
+        deploy: {
+          ...baseServiceConfiguration,
+          labels: [
+            'managedBy=coolify',
+            'type=service',
+            'serviceName=plausible'
+          ]
+        }
+      },
+      plausible_events_db: {
+        image: 'yandex/clickhouse-server:21.3.2.5',
+        networks: [`${docker.network}`],
+        volumes: [`${deployId}-clickhouse-data:/var/lib/clickhouse`],
+        ulimits: {
+          nofile: {
+            soft: 262144,
+            hard: 262144
+          }
+        },
+        configs: [...clickhouseConfigs],
+        deploy: {
+          ...baseServiceConfiguration,
+          labels: [
+            'managedBy=coolify',
+            'type=service',
+            'serviceName=plausible'
+          ]
+        }
+      }
+    },
+    networks: {
+      [`${docker.network}`]: {
+        external: true
+      }
+    },
+    volumes: {
+      [`${deployId}-clickhouse-data`]: {
+        external: true
+      },
+      [`${deployId}-postgres-data`]: {
+        external: true
+      }
+    },
+    configs: {
+      'plausible-clickhouse-user-config.xml': {
+        file: `${workdir}/clickhouse-user-config.xml`
+      },
+      'plausible-clickhouse-config.xml': {
+        file: `${workdir}/clickhouse-config.xml`
+      },
+      'plausible-init.query': {
+        file: `${workdir}/init.query`
+      },
+      'plausible-init-db.sh': {
+        file: `${workdir}/init-db.sh`
+      }
+    }
+  }
+  await fs.writeFile(`${workdir}/stack.yml`, yaml.dump(stack))
+  await execShellAsync('docker stack rm plausible')
+  await execShellAsync(
+    `cat ${workdir}/stack.yml | docker stack deploy --prune -c - ${deployId}`
+  )
+  cleanupTmp(workdir)
+}
+
+async function activateAdminUser () {
+  const { POSTGRESQL_USERNAME, POSTGRESQL_PASSWORD, POSTGRESQL_DATABASE } = JSON.parse(JSON.parse((await execShellAsync('docker service inspect plausible_plausible --format=\'{{json .Spec.Labels.configuration}}\'')))).generateEnvsPostgres
+  const containers = (await execShellAsync('docker ps -a --format=\'{{json .Names}}\'')).replace(/"/g, '').trim().split('\n')
+  const postgresDB = containers.find(container => container.startsWith('plausible_plausible_db'))
+  await execShellAsync(`docker exec ${postgresDB} psql -H postgresql://${POSTGRESQL_USERNAME}:${POSTGRESQL_PASSWORD}@localhost:5432/${POSTGRESQL_DATABASE} -c "UPDATE users SET email_verified = true;"`)
+}
+
+module.exports = { plausible, activateAdminUser }
diff --git a/api/routes/v1/dashboard/index.js b/api/routes/v1/dashboard/index.js
index 4205a66d8..acc5cf6ab 100644
--- a/api/routes/v1/dashboard/index.js
+++ b/api/routes/v1/dashboard/index.js
@@ -23,9 +23,10 @@ module.exports = async function (fastify) {
         }
       ])
       const serverLogs = await ServerLog.find()
-      const services = await docker.engine.listServices()
-      let applications = services.filter(r => r.Spec.Labels.managedBy === 'coolify' && r.Spec.Labels.type === 'application' && r.Spec.Labels.configuration)
-      let databases = services.filter(r => r.Spec.Labels.managedBy === 'coolify' && r.Spec.Labels.type === 'database' && r.Spec.Labels.configuration)
+      const dockerServices = await docker.engine.listServices()
+      let applications = dockerServices.filter(r => r.Spec.Labels.managedBy === 'coolify' && r.Spec.Labels.type === 'application' && r.Spec.Labels.configuration)
+      let databases = dockerServices.filter(r => r.Spec.Labels.managedBy === 'coolify' && r.Spec.Labels.type === 'database' && r.Spec.Labels.configuration)
+      let services = dockerServices.filter(r => r.Spec.Labels.managedBy === 'coolify' && r.Spec.Labels.type === 'service' && r.Spec.Labels.configuration)
       applications = applications.map(r => {
         if (JSON.parse(r.Spec.Labels.configuration)) {
           const configuration = JSON.parse(r.Spec.Labels.configuration)
@@ -41,6 +42,11 @@ module.exports = async function (fastify) {
         r.Spec.Labels.configuration = configuration
         return r
       })
+      services = services.map(r => {
+        const configuration = r.Spec.Labels.configuration ? JSON.parse(r.Spec.Labels.configuration) : null
+        r.Spec.Labels.configuration = configuration
+        return r
+      })
       applications = [...new Map(applications.map(item => [item.Spec.Labels.configuration.publish.domain + item.Spec.Labels.configuration.publish.path, item])).values()]
       return {
         serverLogs,
@@ -49,6 +55,9 @@ module.exports = async function (fastify) {
         },
         databases: {
           deployed: databases
+        },
+        services: {
+          deployed: services
         }
       }
     } catch (error) {
diff --git a/api/routes/v1/databases/index.js b/api/routes/v1/databases/index.js
index 9cdac684f..da0f34506 100644
--- a/api/routes/v1/databases/index.js
+++ b/api/routes/v1/databases/index.js
@@ -18,13 +18,15 @@ module.exports = async function (fastify) {
       const database = (await docker.engine.listServices()).find(r => r.Spec.Labels.managedBy === 'coolify' && r.Spec.Labels.type === 'database' && JSON.parse(r.Spec.Labels.configuration).general.deployId === deployId)
       if (database) {
         const jsonEnvs = {}
-        for (const d of database.Spec.TaskTemplate.ContainerSpec.Env) {
-          const s = d.split('=')
-          jsonEnvs[s[0]] = s[1]
+        if (database.Spec.TaskTemplate.ContainerSpec.Env) {
+          for (const d of database.Spec.TaskTemplate.ContainerSpec.Env) {
+            const s = d.split('=')
+            jsonEnvs[s[0]] = s[1]
+          }
         }
         const payload = {
           config: JSON.parse(database.Spec.Labels.configuration),
-          envs: jsonEnvs
+          envs: jsonEnvs || null
         }
         reply.code(200).send(payload)
       } else {
@@ -39,7 +41,7 @@ module.exports = async function (fastify) {
     body: {
       type: 'object',
       properties: {
-        type: { type: 'string', enum: ['mongodb', 'postgresql', 'mysql', 'couchdb'] }
+        type: { type: 'string', enum: ['mongodb', 'postgresql', 'mysql', 'couchdb', 'clickhouse'] }
       },
       required: ['type']
     }
@@ -82,9 +84,11 @@ module.exports = async function (fastify) {
           name: nickname
         }
       }
+      await execShellAsync(`mkdir -p ${configuration.general.workdir}`)
       let generateEnvs = {}
       let image = null
       let volume = null
+      let ulimits = {}
       if (type === 'mongodb') {
         generateEnvs = {
           MONGODB_ROOT_PASSWORD: passwords[0],
@@ -119,6 +123,15 @@ module.exports = async function (fastify) {
         }
         image = 'bitnami/mysql:8.0'
         volume = `${configuration.general.deployId}-${type}-data:/bitnami/mysql/data`
+      } else if (type === 'clickhouse') {
+        image = 'yandex/clickhouse-server'
+        volume = `${configuration.general.deployId}-${type}-data:/var/lib/clickhouse`
+        ulimits = {
+          nofile: {
+            soft: 262144,
+            hard: 262144
+          }
+        }
       }
 
       const stack = {
@@ -129,6 +142,7 @@ module.exports = async function (fastify) {
             networks: [`${docker.network}`],
             environment: generateEnvs,
             volumes: [volume],
+            ulimits,
             deploy: {
               replicas: 1,
               update_config: {
@@ -160,12 +174,12 @@ module.exports = async function (fastify) {
           }
         }
       }
-      await execShellAsync(`mkdir -p ${configuration.general.workdir}`)
       await fs.writeFile(`${configuration.general.workdir}/stack.yml`, yaml.dump(stack))
       await execShellAsync(
-              `cat ${configuration.general.workdir}/stack.yml | docker stack deploy -c - ${configuration.general.deployId}`
+        `cat ${configuration.general.workdir}/stack.yml | docker stack deploy -c - ${configuration.general.deployId}`
       )
     } catch (error) {
+      console.log(error)
       await saveServerLog(error)
       throw new Error(error)
     }
diff --git a/api/routes/v1/services/deploy.js b/api/routes/v1/services/deploy.js
new file mode 100644
index 000000000..481bf8b9b
--- /dev/null
+++ b/api/routes/v1/services/deploy.js
@@ -0,0 +1,15 @@
+const { plausible, activateAdminUser } = require('../../../libs/services/plausible')
+
+module.exports = async function (fastify) {
+  fastify.post('/plausible', async (request, reply) => {
+    let { email, userName, userPassword, baseURL } = request.body
+    const traefikURL = baseURL
+    baseURL = `https://${baseURL}`
+    await plausible({ email, userName, userPassword, baseURL, traefikURL })
+    return {}
+  })
+  fastify.patch('/plausible/activate', async (request, reply) => {
+    await activateAdminUser()
+    return 'OK'
+  })
+}
diff --git a/api/routes/v1/services/index.js b/api/routes/v1/services/index.js
new file mode 100644
index 000000000..b9a5501f1
--- /dev/null
+++ b/api/routes/v1/services/index.js
@@ -0,0 +1,27 @@
+const { execShellAsync } = require('../../../libs/common')
+const { docker } = require('../../../libs/docker')
+
+module.exports = async function (fastify) {
+  fastify.get('/:serviceName', async (request, reply) => {
+    const { serviceName } = request.params
+    try {
+      const service = (await docker.engine.listServices()).find(r => r.Spec.Labels.managedBy === 'coolify' && r.Spec.Labels.type === 'service' && r.Spec.Labels.serviceName === serviceName && r.Spec.Name === `${serviceName}_${serviceName}`)
+      if (service) {
+        const payload = {
+          config: JSON.parse(service.Spec.Labels.configuration)
+        }
+        reply.code(200).send(payload)
+      } else {
+        throw new Error()
+      }
+    } catch (error) {
+      console.log(error)
+      throw new Error('No service found?')
+    }
+  })
+  fastify.delete('/:serviceName', async (request, reply) => {
+    const { serviceName } = request.params
+    await execShellAsync(`docker stack rm ${serviceName}`)
+    reply.code(200).send({})
+  })
+}
diff --git a/package.json b/package.json
index c34c051ad..e8eeb15ef 100644
--- a/package.json
+++ b/package.json
@@ -1,7 +1,7 @@
 {
   "name": "coolify",
   "description": "An open-source, hassle-free, self-hostable Heroku & Netlify alternative.",
-  "version": "1.0.8",
+  "version": "1.0.9",
   "license": "AGPL-3.0",
   "scripts": {
     "lint": "standard",
@@ -18,7 +18,7 @@
   "dependencies": {
     "@iarna/toml": "^2.2.5",
     "@roxi/routify": "^2.15.1",
-    "@zerodevx/svelte-toast": "^0.2.1",
+    "@zerodevx/svelte-toast": "^0.2.2",
     "ajv": "^8.1.0",
     "axios": "^0.21.1",
     "commander": "^7.2.0",
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index a1706c14f..7f8173149 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -3,7 +3,7 @@ lockfileVersion: 5.3
 specifiers:
   '@iarna/toml': ^2.2.5
   '@roxi/routify': ^2.15.1
-  '@zerodevx/svelte-toast': ^0.2.1
+  '@zerodevx/svelte-toast': ^0.2.2
   ajv: ^8.1.0
   axios: ^0.21.1
   commander: ^7.2.0
@@ -45,7 +45,7 @@ specifiers:
 dependencies:
   '@iarna/toml': 2.2.5
   '@roxi/routify': 2.15.1
-  '@zerodevx/svelte-toast': 0.2.1
+  '@zerodevx/svelte-toast': 0.2.2
   ajv: 8.1.0
   axios: 0.21.1
   commander: 7.2.0
@@ -563,8 +563,8 @@ packages:
     resolution: {integrity: sha512-b+zB8A2so8eCE0JsxjL24J7vdGl8rzPQ09hZNhystm+KqSbKcAej1A+Hbva1rCMmTTqA+hFnUSDc5kouEo0JzA==}
     dev: true
 
-  /@zerodevx/svelte-toast/0.2.1:
-    resolution: {integrity: sha512-3yOusE+/xDaVNxkBJwbxDZea5ePQ77B15tbHv6ZlSYtlJu0u0PDhGMu8eoI+SmcCt4j+2sf0A1uS9+LcBIqUgg==}
+  /@zerodevx/svelte-toast/0.2.2:
+    resolution: {integrity: sha512-zriB7tSY54OEbRDqJ1NbHBv5Z83tWKhqqW7a+z8HMtZeR49zZUMLISFXmY7B8tMwzO6auB3A5dxuFyqB9+TZkQ==}
     dev: false
 
   /abab/2.0.5:
diff --git a/src/App.svelte b/src/App.svelte
index 8fe87ef35..77a76d6b3 100644
--- a/src/App.svelte
+++ b/src/App.svelte
@@ -31,7 +31,7 @@
     @apply bg-warmGray-700 !important;
   }
   :global(input) {
-    @apply text-sm rounded py-2 px-6 font-bold bg-warmGray-800 text-white transition duration-150 outline-none !important;
+    @apply text-sm rounded py-2 px-6 font-bold bg-warmGray-800 text-white transition duration-150 outline-none border border-transparent !important;
   }
   :global(input:hover) {
     @apply bg-warmGray-700 !important;
diff --git a/src/components/Databases/Configuration/Configuration.svelte b/src/components/Databases/Configuration/Configuration.svelte
index cb453de45..0ba93ee52 100644
--- a/src/components/Databases/Configuration/Configuration.svelte
+++ b/src/components/Databases/Configuration/Configuration.svelte
@@ -58,6 +58,13 @@
       >
         Couchdb
       </button>
+      <!-- <button
+      class="button bg-gray-500 p-2 text-white hover:bg-yellow-500 cursor-pointer w-32"
+      on:click="{() => (type = 'clickhouse')}"
+      class:bg-yellow-500="{type === 'clickhouse'}"
+    >
+      Clickhouse
+    </button> -->
     </div>
     {#if type}
       <div>
@@ -81,6 +88,8 @@
           class:hover:bg-orange-500="{type === 'mysql'}"
           class:bg-red-600="{type === 'couchdb'}"
           class:hover:bg-red-500="{type === 'couchdb'}"
+          class:bg-yellow-500="{type === 'clickhouse'}"
+          class:hover:bg-yellow-400="{type === 'clickhouse'}"
           class="button p-2 w-32 text-white"
           on:click="{deploy}">Deploy</button
         >
diff --git a/src/components/Databases/SVGs/Clickhouse.svelte b/src/components/Databases/SVGs/Clickhouse.svelte
new file mode 100644
index 000000000..b8cd28933
--- /dev/null
+++ b/src/components/Databases/SVGs/Clickhouse.svelte
@@ -0,0 +1,9 @@
+<script>
+  export let customClass;
+</script>
+
+<svg class="{customClass}" viewBox="0 0 9 8" xmlns="http://www.w3.org/2000/svg"
+  ><path d="m0 7h1v1h-1z" fill="#f00"></path><path
+    d="m0 0h1v7h-1zm2 0h1v8h-1zm2 0h1v8h-1zm2 0h1v8h-1zm2 3.25h1v1.5h-1z"
+    fill="#fc0"></path></svg
+>
diff --git a/src/components/PasswordField.svelte b/src/components/PasswordField.svelte
new file mode 100644
index 000000000..7d59299b9
--- /dev/null
+++ b/src/components/PasswordField.svelte
@@ -0,0 +1,54 @@
+<script>
+  export let value;
+  let showPassword = false;
+</script>
+
+<div class="relative w-full">
+  <input
+    type="{showPassword ? 'text' : 'password'}"
+    class="w-full "
+    {value}
+    disabled
+  />
+  <div
+    class="absolute top-0 my-2 mx-2 right-0 cursor-pointer text-warmGray-600 hover:text-white"
+    on:click="{() => showPassword = !showPassword}"
+  >
+    {#if showPassword}
+      <svg
+        xmlns="http://www.w3.org/2000/svg"
+        class="h-6 w-6"
+        fill="none"
+        viewBox="0 0 24 24"
+        stroke="currentColor"
+      >
+        <path
+          stroke-linecap="round"
+          stroke-linejoin="round"
+          stroke-width="2"
+          d="M13.875 18.825A10.05 10.05 0 0112 19c-4.478 0-8.268-2.943-9.543-7a9.97 9.97 0 011.563-3.029m5.858.908a3 3 0 114.243 4.243M9.878 9.878l4.242 4.242M9.88 9.88l-3.29-3.29m7.532 7.532l3.29 3.29M3 3l3.59 3.59m0 0A9.953 9.953 0 0112 5c4.478 0 8.268 2.943 9.543 7a10.025 10.025 0 01-4.132 5.411m0 0L21 21"
+        ></path>
+      </svg>
+    {:else}
+      <svg
+        xmlns="http://www.w3.org/2000/svg"
+        class="h-6 w-6"
+        fill="none"
+        viewBox="0 0 24 24"
+        stroke="currentColor"
+      >
+        <path
+          stroke-linecap="round"
+          stroke-linejoin="round"
+          stroke-width="2"
+          d="M15 12a3 3 0 11-6 0 3 3 0 016 0z"></path>
+        <path
+          stroke-linecap="round"
+          stroke-linejoin="round"
+          stroke-width="2"
+          d="M2.458 12C3.732 7.943 7.523 5 12 5c4.478 0 8.268 2.943 9.542 7-1.274 4.057-5.064 7-9.542 7-4.477 0-8.268-2.943-9.542-7z"
+        ></path>
+      </svg>
+    {/if}
+  </div>
+</div>
diff --git a/src/components/Services/Plausible.svelte b/src/components/Services/Plausible.svelte
new file mode 100644
index 000000000..fe74ab85a
--- /dev/null
+++ b/src/components/Services/Plausible.svelte
@@ -0,0 +1,82 @@
+<script>
+  import { fetch } from "@store";
+  import { params } from "@roxi/routify/runtime";
+  import { fade } from "svelte/transition";
+  import { toast } from "@zerodevx/svelte-toast";
+  import Loading from "../Loading.svelte";
+  import TooltipInfo from "../Tooltip/TooltipInfo.svelte";
+  import PasswordField from "../PasswordField.svelte";
+  import Tooltip from "../Tooltip/Tooltip.svelte";
+  export let service;
+
+  $: name = $params.name;
+  let loading = false;
+  async function activate() {
+    try {
+      loading = true;
+      await $fetch(`/api/v1/services/deploy/${name}/activate`, {
+        method: "PATCH",
+        body: {},
+      });
+      toast.push(`All users are activated for Plausible.`);
+    } catch (error) {
+      console.log(error);
+      toast.push(`Ooops, there was an error activating users for Plausible?!`);
+    } finally {
+      loading = false;
+    }
+  }
+</script>
+
+{#if loading}
+  <Loading />
+{:else}
+  <div class="text-left max-w-5xl mx-auto px-6" in:fade="{{ duration: 100 }}">
+    <div class="pb-2 pt-5 space-y-4">
+      <div class="flex space-x-5 items-center">
+        <div class="text-2xl font-bold py-4 border-gradient">General</div>
+        <div class="flex-1"></div>
+        <Tooltip
+          position="bottom"
+          size="large"
+          label="Activate all users in Plausible database, so you can login without the email verification."
+        >
+          <button
+            class="button bg-blue-500 hover:bg-blue-400 px-2"
+            on:click="{activate}">Activate All Users</button
+          >
+        </Tooltip>
+      </div>
+
+      <div class="flex items-center">
+        <div class="font-bold w-64 text-warmGray-400">Domain</div>
+        <input class="w-full" value="{service.config.baseURL}" disabled />
+      </div>
+      <div class="flex items-center">
+        <div class="font-bold w-64 text-warmGray-400">Email address</div>
+        <input class="w-full" value="{service.config.email}" disabled />
+      </div>
+      <div class="flex items-center">
+        <div class="font-bold w-64 text-warmGray-400">Username</div>
+        <input class="w-full" value="{service.config.userName}" disabled />
+      </div>
+      <div class="flex items-center">
+        <div class="font-bold w-64 text-warmGray-400">Password</div>
+        <PasswordField value="{service.config.userPassword}" />
+      </div>
+      <div class="text-2xl font-bold py-4 border-gradient w-32">PostgreSQL</div>
+      <div class="flex items-center">
+        <div class="font-bold w-64 text-warmGray-400">Username</div>
+        <input class="w-full" value="{service.config.generateEnvsPostgres.POSTGRESQL_USERNAME}" disabled />
+      </div>
+      <div class="flex items-center">
+        <div class="font-bold w-64 text-warmGray-400">Password</div>
+        <PasswordField value="{service.config.generateEnvsPostgres.POSTGRESQL_PASSWORD}" />
+      </div>
+      <div class="flex items-center">
+        <div class="font-bold w-64 text-warmGray-400">Database</div>
+        <input class="w-full" value="{service.config.generateEnvsPostgres.POSTGRESQL_DATABASE}" disabled />
+      </div>
+    </div>
+  </div>
+{/if}
diff --git a/src/index.css b/src/index.css
index 2b0db5aea..68f14a23a 100644
--- a/src/index.css
+++ b/src/index.css
@@ -34,7 +34,7 @@ body {
   font-family: 'Inter';
   font-size: 16px;
   font-weight: 600;
-   white-space: normal;
+  white-space: normal;
 }
 
 [role~="tooltip"][data-microtip-position|="bottom"]::before {
diff --git a/src/pages/_layout.svelte b/src/pages/_layout.svelte
index f354764a4..ee6cd9f2d 100644
--- a/src/pages/_layout.svelte
+++ b/src/pages/_layout.svelte
@@ -145,7 +145,7 @@
         <img class="w-10 pt-4 pb-4" src="/favicon.png" alt="coolLabs logo" />
         <Tooltip position="right" label="Applications">
           <div
-            class="p-2 hover:bg-warmGray-700 rounded hover:text-green-500 my-4 transition-all duration-100 cursor-pointer"
+            class="p-2 hover:bg-warmGray-700 rounded hover:text-green-500 mt-4 transition-all duration-100 cursor-pointer"
             on:click="{() => $goto('/dashboard/applications')}"
             class:text-green-500="{$isActive('/dashboard/applications') ||
               $isActive('/application')}"
@@ -185,7 +185,7 @@
         </Tooltip>
         <Tooltip position="right" label="Databases">
           <div
-            class="p-2 hover:bg-warmGray-700 rounded hover:text-purple-500 transition-all duration-100 cursor-pointer"
+            class="p-2 hover:bg-warmGray-700 rounded hover:text-purple-500 my-4 transition-all duration-100 cursor-pointer"
             on:click="{() => $goto('/dashboard/databases')}"
             class:text-purple-500="{$isActive('/dashboard/databases') ||
               $isActive('/database')}"
@@ -208,6 +208,20 @@
             </svg>
           </div>
         </Tooltip>
+        <Tooltip position="right" label="Services">
+          <div
+            class="p-2 hover:bg-warmGray-700 rounded hover:text-blue-500 transition-all duration-100 cursor-pointer"
+            on:click="{() => $goto('/dashboard/services')}"
+            class:text-blue-500="{$isActive('/dashboard/services') ||
+              $isActive('/service')}"
+            class:bg-warmGray-700="{$isActive('/dashboard/services') ||
+              $isActive('/service')}"
+          >
+          <svg xmlns="http://www.w3.org/2000/svg" class="w-8" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 15a4 4 0 004 4h9a5 5 0 10-.1-9.999 5.002 5.002 0 10-9.78 2.096A4.001 4.001 0 003 15z" />
+          </svg>
+          </div>
+        </Tooltip>
         <div class="flex-1"></div>
         <Tooltip position="right" label="Settings">
           <button
diff --git a/src/pages/application/[organization]/[name]/[branch]/overview.svelte b/src/pages/application/[organization]/[name]/[branch]/overview.svelte
index e0e5473e2..992438afe 100644
--- a/src/pages/application/[organization]/[name]/[branch]/overview.svelte
+++ b/src/pages/application/[organization]/[name]/[branch]/overview.svelte
@@ -10,7 +10,7 @@
     Overview of
     <a
       target="_blank"
-      class="text-green-500 hover:underline cursor-pointer px-2"
+      class="hover:underline cursor-pointer px-2"
       href="{'https://' +
         $application.publish.domain +
         $application.publish.path}">{$application.publish.domain}</a
diff --git a/src/pages/application/_layout.svelte b/src/pages/application/_layout.svelte
index 3f648d3dc..d05f40dc4 100644
--- a/src/pages/application/_layout.svelte
+++ b/src/pages/application/_layout.svelte
@@ -50,7 +50,7 @@ import Tooltip from "../../components/Tooltip/Tooltip.svelte";
 
   async function deploy() {
     try {
-      $application.build.pack =  $application.build.pack.replace('.','').toLowerCase()
+      $application.build.pack = $application.build.pack.replace('.','').toLowerCase()
       toast.push("Checking inputs.");
       await $fetch(`/api/v1/application/check`, {
         body: $application,
diff --git a/src/pages/dashboard/applications.svelte b/src/pages/dashboard/applications.svelte
index d19557f5c..ccb28671c 100644
--- a/src/pages/dashboard/applications.svelte
+++ b/src/pages/dashboard/applications.svelte
@@ -39,12 +39,12 @@
 </div>
 <div in:fade="{{ duration: 100 }}">
   {#if $deployments.applications?.deployed.length > 0}
-    <div class="px-4 mx-auto py-5">
+    <div class="px-4 mx-auto py-5 z-auto">
       <div class="flex items-center justify-center flex-wrap">
         {#each $deployments.applications.deployed as application}
           <div class="px-4 pb-4">
             <div
-              class="relative rounded-xl py-6 w-52 h-32 bg-warmGray-800 hover:bg-green-500 text-white shadow-md cursor-pointer ease-in-out transform hover:scale-105 duration-200 hover:rotate-1 group"
+              class="relative rounded-xl p-6 bg-warmGray-800 border-2 border-dashed border-transparent hover:border-green-500 text-white shadow-md cursor-pointer ease-in-out transform hover:scale-105 duration-100 group"
               on:click="{() =>
                 switchTo({
                   branch:
@@ -199,7 +199,7 @@
                 {/if}
                 <div class="flex flex-col justify-center items-center w-full">
                   <div
-                    class="text-xs font-bold text-center w-full text-warmGray-300 group-hover:text-white pb-6"
+                    class="text-base font-bold text-center w-full text-white pb-6"
                   >
                     {application.Spec.Labels.configuration.publish
                       .domain}{application.Spec.Labels.configuration.publish
diff --git a/src/pages/dashboard/databases.svelte b/src/pages/dashboard/databases.svelte
index 814b04b50..6efc2b726 100644
--- a/src/pages/dashboard/databases.svelte
+++ b/src/pages/dashboard/databases.svelte
@@ -49,6 +49,7 @@
   import Postgresql from "../../components/Databases/SVGs/Postgresql.svelte";
   import Mysql from "../../components/Databases/SVGs/Mysql.svelte";
   import CouchDb from "../../components/Databases/SVGs/CouchDb.svelte";
+  import Clickhouse from "../../components/Databases/SVGs/Clickhouse.svelte";
   const initialNumberOfDBs = $deployments.databases?.deployed.length;
   $: if ($deployments.databases?.deployed.length) {
     if (initialNumberOfDBs !== $deployments.databases?.deployed.length) {
@@ -86,15 +87,15 @@
       <div class="flex items-center justify-center flex-wrap">
         {#each $deployments.databases.deployed as database}
           <div
-          in:fade="{{ duration: 200 }}"
+            in:fade="{{ duration: 200 }}"
             class="px-4 pb-4"
             on:click="{() =>
               $goto(
-                `/database/${database.Spec.Labels.configuration.general.deployId}/overview`,
+                `/database/${database.Spec.Labels.configuration.general.deployId}/configuration`,
               )}"
           >
             <div
-              class="relative rounded-xl p-6 w-52 h-32 bg-warmGray-800 hover:bg-purple-500 text-white shadow-md cursor-pointer ease-in-out transform hover:scale-105 duration-200 hover:rotate-1 group"
+              class="relative rounded-xl p-6 bg-warmGray-800 border-2 border-dashed border-transparent hover:border-purple-500 text-white shadow-md cursor-pointer ease-in-out transform hover:scale-105 duration-100 group"
             >
               <div class="flex items-center">
                 {#if database.Spec.Labels.configuration.general.type == "mongodb"}
@@ -109,11 +110,20 @@
                   <CouchDb
                     customClass="w-10 h-10 fill-current text-red-600 absolute top-0 left-0 -m-4"
                   />
+                {:else if database.Spec.Labels.configuration.general.type == "clickhouse"}
+                  <Clickhouse
+                    customClass="w-10 h-10 fill-current text-red-600 absolute top-0 left-0 -m-4"
+                  />
                 {/if}
-                <div
-                  class="text-xs font-bold text-center w-full text-warmGray-300  group-hover:text-white"
-                >
-                  {database.Spec.Labels.configuration.general.nickname}
+                <div class="text-center w-full">
+                  <div
+                    class="text-base font-bold text-white group-hover:text-white"
+                  >
+                    {database.Spec.Labels.configuration.general.nickname}
+                  </div>
+                  <div class="text-xs font-bold text-warmGray-300 ">
+                    ({database.Spec.Labels.configuration.general.type})
+                  </div>
                 </div>
               </div>
             </div>
@@ -121,27 +131,26 @@
         {/each}
         {#if $dbInprogress}
           <div class=" px-4 pb-4">
-            <div class="gradient-border text-xs font-bold text-warmGray-300 pt-6">
+            <div
+              class="gradient-border text-xs font-bold text-warmGray-300 pt-6"
+            >
               Working...
             </div>
           </div>
         {/if}
       </div>
     </div>
-  {:else}
-
-    {#if $dbInprogress}
+  {:else if $dbInprogress}
     <div class="px-4 mx-auto py-5">
-    <div class="flex items-center justify-center flex-wrap">
-    <div class=" px-4 pb-4">
-      <div class="gradient-border text-xs font-bold text-warmGray-300 pt-6">
-        Working...
+      <div class="flex items-center justify-center flex-wrap">
+        <div class=" px-4 pb-4">
+          <div class="gradient-border text-xs font-bold text-warmGray-300 pt-6">
+            Working...
+          </div>
+        </div>
       </div>
     </div>
-    </div>
-  </div>
-    {:else}
+  {:else}
     <div class="text-2xl font-bold text-center">No databases found</div>
   {/if}
-  {/if}
 </div>
diff --git a/src/pages/dashboard/services.svelte b/src/pages/dashboard/services.svelte
new file mode 100644
index 000000000..ff871405d
--- /dev/null
+++ b/src/pages/dashboard/services.svelte
@@ -0,0 +1,74 @@
+<script>
+  import { deployments, dateOptions } from "@store";
+  import { fade } from "svelte/transition";
+  import { goto } from "@roxi/routify/runtime";
+
+  function switchTo(application) {
+    const { branch, name, organization } = application;
+    $goto(`/application/:organization/:name/:branch`, {
+      name,
+      organization,
+      branch,
+    });
+  }
+</script>
+
+<div
+  in:fade="{{ duration: 100 }}"
+  class="py-5 text-left px-6 text-3xl tracking-tight font-bold flex items-center"
+>
+  <div>Services</div>
+  <button
+    class="icon p-1 ml-4 bg-blue-500 hover:bg-blue-400"
+    on:click="{() => $goto('/service/new')}"
+  >
+    <svg
+      class="w-6"
+      xmlns="http://www.w3.org/2000/svg"
+      fill="none"
+      viewBox="0 0 24 24"
+      stroke="currentColor"
+    >
+      <path
+        stroke-linecap="round"
+        stroke-linejoin="round"
+        stroke-width="2"
+        d="M12 6v6m0 0v6m0-6h6m-6 0H6"></path>
+    </svg>
+  </button>
+</div>
+<div in:fade="{{ duration: 100 }}">
+  {#if $deployments.services?.deployed.length > 0}
+    <div class="px-4 mx-auto py-5">
+      <div class="flex items-center justify-center flex-wrap">
+        {#each $deployments.services.deployed as service}
+          <div
+            in:fade="{{ duration: 200 }}"
+            class="px-4 pb-4"
+            on:click="{() =>
+              $goto(`/service/${service.Spec.Labels.serviceName}/configuration`)}"
+          >
+            <div
+              class="relative rounded-xl p-6 bg-warmGray-800 border-2 border-dashed border-transparent hover:border-blue-500 text-white shadow-md cursor-pointer ease-in-out transform hover:scale-105 duration-100 group"
+            >
+              <div class="flex items-center">
+                {#if service.Spec.Labels.serviceName == "plausible"}
+                  <div>
+                    <img
+                      alt="plausible logo"
+                      class="w-10 absolute top-0 left-0 -m-6"
+                      src="https://cdn.coollabs.io/assets/coolify/services/plausible/logo_sm.png"
+                    />
+                    <div class="text-white font-bold">Plausible Analytics</div>
+                  </div>
+                {/if}
+              </div>
+            </div>
+          </div>
+        {/each}
+      </div>
+    </div>
+  {:else}
+    <div class="text-2xl font-bold text-center">No services found</div>
+  {/if}
+</div>
diff --git a/src/pages/database/[name]/overview.svelte b/src/pages/database/[name]/configuration.svelte
similarity index 73%
rename from src/pages/database/[name]/overview.svelte
rename to src/pages/database/[name]/configuration.svelte
index 4899a4872..796ffa5d6 100644
--- a/src/pages/database/[name]/overview.svelte
+++ b/src/pages/database/[name]/configuration.svelte
@@ -1,19 +1,23 @@
 <script>
   import { fetch, database } from "@store";
   import { redirect, params } from "@roxi/routify/runtime";
+  import { toast } from "@zerodevx/svelte-toast";
   import { fade } from "svelte/transition";
+
   import CouchDb from "../../../components/Databases/SVGs/CouchDb.svelte";
   import MongoDb from "../../../components/Databases/SVGs/MongoDb.svelte";
   import Mysql from "../../../components/Databases/SVGs/Mysql.svelte";
   import Postgresql from "../../../components/Databases/SVGs/Postgresql.svelte";
-import Loading from "../../../components/Loading.svelte";
-  
+  import Loading from "../../../components/Loading.svelte";
+  import PasswordField from "../../../components/PasswordField.svelte";
+
   $: name = $params.name;
 
   async function loadDatabaseConfig() {
     if (name) {
       try {
         $database = await $fetch(`/api/v1/databases/${name}`);
+        console.log($database);
       } catch (error) {
         toast.push(`Cannot find database ${name}`);
         $redirect(`/dashboard/databases`);
@@ -23,7 +27,7 @@ import Loading from "../../../components/Loading.svelte";
 </script>
 
 {#await loadDatabaseConfig()}
-<Loading/>
+  <Loading />
 {:then}
   <div class="min-h-full text-white">
     <div
@@ -43,37 +47,34 @@ import Loading from "../../../components/Loading.svelte";
       </div>
     </div>
   </div>
-  <div
-    class="text-left max-w-5xl mx-auto px-6"
-    in:fade="{{ duration: 100 }}"
-  >
-    <div class="pb-2 pt-5">
+  <div class="text-left max-w-6xl mx-auto px-6" in:fade="{{ duration: 100 }}">
+    <div class="pb-2 pt-5 space-y-4">
+      <div class="text-2xl font-bold py-4 border-gradient w-32">Database</div>
       <div class="flex items-center">
-        <div class="font-bold w-48 text-warmGray-400">Connection string</div>
+        <div class="font-bold w-64 text-warmGray-400">Connection string</div>
         {#if $database.config.general.type === "mongodb"}
-          <textarea
-            disabled
-            class="w-full"
+          <PasswordField
             value="{`mongodb://${$database.envs.MONGODB_USERNAME}:${$database.envs.MONGODB_PASSWORD}@${$database.config.general.deployId}:27017/${$database.envs.MONGODB_DATABASE}`}"
           />
         {:else if $database.config.general.type === "postgresql"}
-          <textarea
-            disabled
-            class="w-full"
+          <PasswordField
             value="{`postgresql://${$database.envs.POSTGRESQL_USERNAME}:${$database.envs.POSTGRESQL_PASSWORD}@${$database.config.general.deployId}:5432/${$database.envs.POSTGRESQL_DATABASE}`}"
           />
         {:else if $database.config.general.type === "mysql"}
-          <textarea
-            disabled
-            class="w-full"
+          <PasswordField
             value="{`mysql://${$database.envs.MYSQL_USER}:${$database.envs.MYSQL_PASSWORD}@${$database.config.general.deployId}:3306/${$database.envs.MYSQL_DATABASE}`}"
           />
         {:else if $database.config.general.type === "couchdb"}
-          <textarea
-            disabled
-            class="w-full"
+          <PasswordField
             value="{`http://${$database.envs.COUCHDB_USER}:${$database.envs.COUCHDB_PASSWORD}@${$database.config.general.deployId}:5984`}"
           />
+        {:else if $database.config.general.type === "clickhouse"}
+          <!-- {JSON.stringify($database)} -->
+          <!-- <textarea
+          disabled
+          class="w-full"
+          value="{`postgresql://${$database.envs.POSTGRESQL_USERNAME}:${$database.envs.POSTGRESQL_PASSWORD}@${$database.config.general.deployId}:5432/${$database.envs.POSTGRESQL_DATABASE}`}"
+        ></textarea> -->
         {/if}
       </div>
     </div>
@@ -83,8 +84,7 @@ import Loading from "../../../components/Loading.svelte";
         <textarea
           disabled
           class="w-full"
-          value="{$database.envs.MONGODB_ROOT_PASSWORD}"
-        ></textarea>
+          value="{$database.envs.MONGODB_ROOT_PASSWORD}"></textarea>
       </div>
     {/if}
   </div>
diff --git a/src/pages/database/_layout.svelte b/src/pages/database/_layout.svelte
index 532f18ccb..2887d0f02 100644
--- a/src/pages/database/_layout.svelte
+++ b/src/pages/database/_layout.svelte
@@ -3,6 +3,7 @@
   import { fetch, database, initialDatabase } from "@store";
   import { toast } from "@zerodevx/svelte-toast";
   import { onDestroy } from "svelte";
+import Tooltip from "../../components/Tooltip/Tooltip.svelte";
 
   $: name = $params.name
 
@@ -23,6 +24,7 @@
   <nav
     class="flex text-white justify-end items-center m-4 fixed right-0 top-0 space-x-4"
   >
+  <Tooltip position="bottom" label="Delete" >
     <button
       title="Delete"
       class="icon hover:text-red-500"
@@ -43,27 +45,39 @@
         ></path>
       </svg>
     </button>
+  </Tooltip>
     <div class="border border-warmGray-700 h-8"></div>
-    <button
-      title="Configuration"
-      disabled
-      class="icon text-warmGray-700 hover:bg-transparent cursor-not-allowed"
-    >
-      <svg
-        class="w-6"
-        xmlns="http://www.w3.org/2000/svg"
-        fill="none"
-        viewBox="0 0 24 24"
-        stroke="currentColor"
+    <Tooltip position="bottom-left" label="Configuration" >
+      <button
+        class="icon hover:text-yellow-400"
+        disabled="{$isActive(`/database/new`)}"
+        class:text-yellow-400="{$isActive(
+          `/database/${name}/configuration`,
+        ) || $isActive(`/application/new`)}"
+        class:bg-warmGray-700="{$isActive(
+          `/database/${name}/configuration`,
+        ) || $isActive(`/database/new`)}"
+        on:click="{() =>
+          $goto(
+            `/database/${name}/configuration`,
+          )}"
       >
-        <path
-          stroke-linecap="round"
-          stroke-linejoin="round"
-          stroke-width="2"
-          d="M12 6V4m0 2a2 2 0 100 4m0-4a2 2 0 110 4m-6 8a2 2 0 100-4m0 4a2 2 0 110-4m0 4v2m0-6V4m6 6v10m6-2a2 2 0 100-4m0 4a2 2 0 110-4m0 4v2m0-6V4"
-        ></path>
-      </svg>
-    </button>
+        <svg
+          class="w-6"
+          xmlns="http://www.w3.org/2000/svg"
+          fill="none"
+          viewBox="0 0 24 24"
+          stroke="currentColor"
+        >
+          <path
+            stroke-linecap="round"
+            stroke-linejoin="round"
+            stroke-width="2"
+            d="M12 6V4m0 2a2 2 0 100 4m0-4a2 2 0 110 4m-6 8a2 2 0 100-4m0 4a2 2 0 110-4m0 4v2m0-6V4m6 6v10m6-2a2 2 0 100-4m0 4a2 2 0 110-4m0 4v2m0-6V4"
+          ></path>
+        </svg>
+      </button>
+    </Tooltip>
   </nav>
 {/if}
 <div class="text-white">
diff --git a/src/pages/service/[name]/_layout.svelte b/src/pages/service/[name]/_layout.svelte
new file mode 100644
index 000000000..f2f2704f8
--- /dev/null
+++ b/src/pages/service/[name]/_layout.svelte
@@ -0,0 +1,81 @@
+<script>
+    import { params, goto, isActive, redirect, url } from "@roxi/routify";
+    import { fetch } from "@store";
+    import { toast } from "@zerodevx/svelte-toast";
+import Tooltip from "../../../components/Tooltip/Tooltip.svelte";
+  
+    $: name = $params.name
+  
+    async function removeService() {
+      await $fetch(`/api/v1/services/${name}`, {
+        method: "DELETE",
+      });
+      toast.push("Service removed.");
+      $redirect(`/dashboard/services`);
+    }
+  </script>
+  
+
+    <nav
+      class="flex text-white justify-end items-center m-4 fixed right-0 top-0 space-x-4"
+    >
+    <Tooltip position="bottom" label="Delete" >
+      <button
+        title="Delete"
+        class="icon hover:text-red-500"
+        on:click="{removeService}"
+      >
+        <svg
+          class="w-6"
+          xmlns="http://www.w3.org/2000/svg"
+          fill="none"
+          viewBox="0 0 24 24"
+          stroke="currentColor"
+        >
+          <path
+            stroke-linecap="round"
+            stroke-linejoin="round"
+            stroke-width="2"
+            d="M19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5 4v6m4-6v6m1-10V4a1 1 0 00-1-1h-4a1 1 0 00-1 1v3M4 7h16"
+          ></path>
+        </svg>
+      </button>
+    </Tooltip>
+      <div class="border border-warmGray-700 h-8"></div>
+      <Tooltip position="bottom-left" label="Configuration" >
+        <button
+          class="icon hover:text-yellow-400"
+          disabled="{$isActive(`/application/new`)}"
+          class:text-yellow-400="{$isActive(
+            `/service/${name}/configuration`,
+          ) || $isActive(`/application/new`)}"
+          class:bg-warmGray-700="{$isActive(
+            `/service/${name}/configuration`,
+          ) || $isActive(`/application/new`)}"
+          on:click="{() =>
+            $goto(
+              `/service/${name}/configuration`,
+            )}"
+        >
+          <svg
+            class="w-6"
+            xmlns="http://www.w3.org/2000/svg"
+            fill="none"
+            viewBox="0 0 24 24"
+            stroke="currentColor"
+          >
+            <path
+              stroke-linecap="round"
+              stroke-linejoin="round"
+              stroke-width="2"
+              d="M12 6V4m0 2a2 2 0 100 4m0-4a2 2 0 110 4m-6 8a2 2 0 100-4m0 4a2 2 0 110-4m0 4v2m0-6V4m6 6v10m6-2a2 2 0 100-4m0 4a2 2 0 110-4m0 4v2m0-6V4"
+            ></path>
+          </svg>
+        </button>
+      </Tooltip>
+    </nav>
+
+  <div class="text-white">
+    <slot />
+  </div>
+  
\ No newline at end of file
diff --git a/src/pages/service/[name]/configuration.svelte b/src/pages/service/[name]/configuration.svelte
new file mode 100644
index 000000000..b9f313a2c
--- /dev/null
+++ b/src/pages/service/[name]/configuration.svelte
@@ -0,0 +1,68 @@
+<script>
+  import { fetch } from "@store";
+  import { redirect, params } from "@roxi/routify/runtime";
+  import { fade } from "svelte/transition";
+  import { toast } from "@zerodevx/svelte-toast";
+
+  import Loading from "../../../components/Loading.svelte";
+  import Plausible from "../../../components/Services/Plausible.svelte";
+
+  $: name = $params.name;
+  let service = {};
+  async function loadServiceConfig() {
+    if (name) {
+      try {
+        service = await $fetch(`/api/v1/services/${name}`);
+      } catch (error) {
+        toast.push(`Cannot find service ${name}?!`);
+        $redirect(`/dashboard/services`);
+      }
+    }
+  }
+  async function activate() {
+    try {
+      await $fetch(`/api/v1/services/deploy/${name}/activate`, {
+        method: "PATCH",
+        body: {},
+      });
+      toast.push(`All users are activated for Plausible.`);
+    } catch (error) {
+      console.log(error);
+      toast.push(`Ooops, there was an error activating users for Plausible?!`);
+    }
+  }
+</script>
+
+{#await loadServiceConfig()}
+  <Loading />
+{:then}
+  <div class="min-h-full text-white">
+    <div
+      class="py-5 text-left px-6 text-3xl tracking-tight font-bold flex items-center"
+    >
+      <a
+        href="{service.config.baseURL}"
+        target="_blank"
+        class="inline-flex hover:underline cursor-pointer px-2"
+      >
+        <div>{name === "plausible" ? "Plausible Analytics" : name}</div>
+        <div class="px-4">
+          {#if name === "plausible"}
+            <img
+              alt="plausible logo"
+              class="w-6 mx-auto"
+              src="https://cdn.coollabs.io/assets/coolify/services/plausible/logo_sm.png"
+            />
+          {/if}
+        </div>
+      </a>
+    </div>
+  </div>
+  <div class="space-y-2 max-w-4xl mx-auto px-6" in:fade="{{ duration: 100 }}">
+    <div class="block text-center py-4">
+      {#if name === "plausible"}
+        <Plausible {service}/>
+      {/if}
+    </div>
+  </div>
+{/await}
diff --git a/src/pages/service/[name]/index.svelte b/src/pages/service/[name]/index.svelte
new file mode 100644
index 000000000..a5319b72e
--- /dev/null
+++ b/src/pages/service/[name]/index.svelte
@@ -0,0 +1,5 @@
+<script>
+    import { redirect } from "@roxi/routify";
+    $redirect("/dashboard/services");
+  </script>
+  
\ No newline at end of file
diff --git a/src/pages/service/new/[type]/_layout.svelte b/src/pages/service/new/[type]/_layout.svelte
new file mode 100644
index 000000000..58c456b7d
--- /dev/null
+++ b/src/pages/service/new/[type]/_layout.svelte
@@ -0,0 +1,33 @@
+<script>
+  import { params, goto, isActive, redirect, url } from "@roxi/routify";
+  import { fetch, newService, initialNewService } from "@store";
+  import { toast } from "@zerodevx/svelte-toast";
+  import Tooltip from "../../../../components/Tooltip/Tooltip.svelte";
+  import { onDestroy } from "svelte";
+  import Loading from "../../../../components/Loading.svelte";
+  $: type = $params.type;
+  async function checkService() {
+    try {
+      await $fetch(`/api/v1/services/${type}`);
+      $redirect(`/dashboard/services`);
+      toast.push(
+        `${
+          type === "plausible" ? "Plausible Analytics" : type
+        } already deployed.`,
+      );
+    } catch (error) {
+      //
+    }
+  }
+  onDestroy(() => {
+    $newService = JSON.parse(JSON.stringify(initialNewService));
+  });
+</script>
+
+{#await checkService()}
+  <Loading />
+{:then}
+  <div class="text-white">
+    <slot />
+  </div>
+{/await}
diff --git a/src/pages/service/new/[type]/index.svelte b/src/pages/service/new/[type]/index.svelte
new file mode 100644
index 000000000..49f8899bb
--- /dev/null
+++ b/src/pages/service/new/[type]/index.svelte
@@ -0,0 +1,136 @@
+<script>
+  import { redirect, params, isActive } from "@roxi/routify/runtime";
+  import { newService, fetch } from "@store";
+  import { fade } from "svelte/transition";
+  import Loading from "../../../../components/Loading.svelte";
+  import TooltipInfo from "../../../../components/Tooltip/TooltipInfo.svelte";
+  import { toast } from "@zerodevx/svelte-toast";
+
+  $: type = $params.type;
+  $: deployable =
+    $newService.baseURL === "" ||
+    $newService.baseURL === null ||
+    $newService.email === "" ||
+    $newService.email === null ||
+    $newService.userName === "" ||
+    $newService.userName === null ||
+    $newService.userPassword === "" ||
+    $newService.userPassword === null ||
+    $newService.userPassword.length <= 6 ||
+    $newService.userPassword !== $newService.userPasswordAgain;
+  let loading = false;
+  async function deploy() {
+    try {
+      loading = true;
+      const payload = $newService;
+      delete payload.userPasswordAgain;
+      await $fetch(`/api/v1/services/deploy/${type}`, {
+        body: payload,
+      });
+      toast.push(
+        "Service deployment queued.<br><br><br>It could take 2-5 minutes to be ready, be patient and grab a coffee/tea!",
+        { duration: 4000 },
+      );
+      $redirect(`/dashboard/services`);
+    } catch (error) {
+      console.log(error);
+      toast.push("Oops something went wrong. See console.log.");
+    } finally {
+      loading = false;
+    }
+  }
+</script>
+
+<div class="min-h-full text-white">
+  <div class="py-5 text-left px-6 text-3xl tracking-tight font-bold">
+    Deploy new
+    {#if type === "plausible"}
+      <span class="text-blue-500 px-2 capitalize">Plausible Analytics</span>
+    {/if}
+  </div>
+</div>
+{#if loading}
+  <Loading />
+{:else}
+  <div
+    class="space-y-2 max-w-4xl mx-auto px-6 flex-col text-center"
+    in:fade="{{ duration: 100 }}"
+  >
+    <div class="grid grid-flow-row">
+      <label for="Domain"
+        >Domain <TooltipInfo
+          position="right"
+          label="{`You will have your Plausible instance at here.`}"
+        /></label
+      >
+      <input
+        id="Domain"
+        class:border-red-500="{$newService.baseURL == null ||
+          $newService.baseURL == ''}"
+        bind:value="{$newService.baseURL}"
+        placeholder="analytics.coollabs.io"
+      />
+    </div>
+    <div class="grid grid-flow-row">
+      <label for="Email">Email</label>
+      <input
+        id="Email"
+        class:border-red-500="{$newService.email == null ||
+          $newService.email == ''}"
+        bind:value="{$newService.email}"
+        placeholder="hi@coollabs.io"
+      />
+    </div>
+    <div class="grid grid-flow-row">
+      <label for="Username">Username </label>
+      <input
+        id="Username"
+        class:border-red-500="{$newService.userName == null ||
+          $newService.userName == ''}"
+        bind:value="{$newService.userName}"
+        placeholder="admin"
+      />
+    </div>
+    <div class="grid grid-flow-row">
+      <label for="Password"
+        >Password <TooltipInfo
+          position="right"
+          label="{`Must be at least 7 characters.`}"
+        /></label
+      >
+      <input
+        id="Password"
+        type="password"
+        class:border-red-500="{$newService.userPassword == null ||
+          $newService.userPassword == '' ||
+          $newService.userPassword.length <= 6}"
+        bind:value="{$newService.userPassword}"
+      />
+    </div>
+    <div class="grid grid-flow-row pb-5">
+      <label for="PasswordAgain">Password again </label>
+      <input
+        id="PasswordAgain"
+        type="password"
+        class:placeholder-red-500="{$newService.userPassword !==
+          $newService.userPasswordAgain}"
+        class:border-red-500="{$newService.userPassword !==
+          $newService.userPasswordAgain}"
+        bind:value="{$newService.userPasswordAgain}"
+      />
+    </div>
+    <button
+      disabled="{deployable}"
+      class:cursor-not-allowed="{deployable}"
+      class:bg-blue-500="{!deployable}"
+      class:hover:bg-blue-400="{!deployable}"
+      class:hover:bg-transparent="{deployable}"
+      class:text-warmGray-700="{deployable}"
+      class:text-white="{!deployable}"
+      class="button p-2"
+      on:click="{deploy}"
+    >
+      Deploy
+    </button>
+  </div>
+{/if}
diff --git a/src/pages/service/new/index.svelte b/src/pages/service/new/index.svelte
new file mode 100644
index 000000000..02d9f4aa1
--- /dev/null
+++ b/src/pages/service/new/index.svelte
@@ -0,0 +1,32 @@
+<script>
+  import { isActive, redirect, goto } from "@roxi/routify/runtime";
+  import { fade } from "svelte/transition";
+</script>
+
+<div class="min-h-full text-white">
+  <div
+    class="py-5 text-left px-6 text-3xl tracking-tight font-bold flex items-center"
+  >
+    Select a service
+  </div>
+</div>
+<div
+  class="text-center space-y-2 max-w-4xl mx-auto px-6"
+  in:fade="{{ duration: 100 }}"
+>
+  {#if $isActive("/service/new")}
+    <div class="flex justify-center space-x-4 font-bold pb-6">
+      <div
+        class="text-center flex-col items-center cursor-pointer ease-in-out transform hover:scale-105 duration-100 border-2 border-dashed border-transparent hover:border-blue-500 p-2 rounded bg-warmGray-800"
+        on:click="{$goto('/service/new/plausible')}"
+      >
+        <img
+          alt="plausible logo"
+          class="w-12 mx-auto"
+          src="https://cdn.coollabs.io/assets/coolify/services/plausible/logo_sm.png"
+        />
+        <div class="text-white">Plausible Analytics</div>
+      </div>
+    </div>
+  {/if}
+</div>
diff --git a/src/pages/settings/index.svelte b/src/pages/settings/index.svelte
index 00877a3c8..914c4e9da 100644
--- a/src/pages/settings/index.svelte
+++ b/src/pages/settings/index.svelte
@@ -37,7 +37,8 @@
 {:then}
 <div in:fade="{{ duration: 100 }}">
   <div class="max-w-4xl mx-auto px-6 pb-4">
-    <div class="">
+    <div>
+      <div class="text-2xl font-bold py-4 border-gradient w-32 text-white">General</div>
       <div class="divide-y divide-gray-200">
         <div class="px-4 sm:px-6">
           <ul class="mt-2 divide-y divide-gray-200">
diff --git a/src/store.js b/src/store.js
index 40113d61a..ac722fbea 100644
--- a/src/store.js
+++ b/src/store.js
@@ -219,3 +219,18 @@ export const database = writable({
 })
 
 export const dbInprogress = writable(false)
+
+export const newService = writable({
+  email: null,
+  userName: 'admin',
+  userPassword: null,
+  userPasswordAgain: null,
+  baseURL: null
+})
+export const initialNewService = {
+  email: null,
+  userName: 'admin',
+  userPassword: null,
+  userPasswordAgain: null,
+  baseURL: null
+}