diff --git a/agentic_security/static/index.html b/agentic_security/static/index.html
index f0301c9..f3a0bef 100644
--- a/agentic_security/static/index.html
+++ b/agentic_security/static/index.html
@@ -33,8 +33,38 @@
       </header>
       [[% include "partials/concent.html" %]]
 
+          <div class="flex space-x-4 overflow-x-auto scrollbar-hide">
+            <div
+              v-for="(config, index) in configs"
+              :key="index"
+              @click="selectConfig(index)"
+              class="flex-none w-1/2 sm:w-1/3 md:w-1/4 lg:w-1/5 border-2 rounded-lg p-4 flex flex-col items-start transition-all hover:shadow-md cursor-pointer"
+              :class="{
+          'border-dark-accent-green': selectedConfig === index,
+          'border-gray-600': selectedConfig !== index
+        }">
+              <div class="flex items-center font-medium mb-2">
+                <img
+                  v-if="config.logo"
+                  :src="config.logo"
+                  class="w-6 h-6 ml-2 rounded-full"
+                  alt="logo" />
+                <span class="ml-2">{{ config.name }}</span>
+
+              </div>
+
+              <div class="text-sm text-gray-400">
+                {{ config.customInstructions || 'Requires API key' }}
+              </div>
+              <div class="mt-2 text-dark-accent-green font-semibold">
+                {{ config.modality || 'API' }}
+              </div>
+            </div>
+          </div>
+        </section>
+      </main>
       <main class="max-w-6xl mx-auto space-y-8">
-        <section class="bg-dark-card rounded-lg p-6 shadow-lg">
+        <section class="bg-dark-card rounded-lg p-6 shadow-lg" v-show="false">
           <h2 class="text-2xl font-bold mb-4">Select a Config</h2>
 
           <div class="flex space-x-4 overflow-x-auto scrollbar-hide">
diff --git a/ui/package-lock.json b/ui/package-lock.json
index e08db41..cf777b6 100644
--- a/ui/package-lock.json
+++ b/ui/package-lock.json
@@ -1,11 +1,11 @@
 {
-  "name": "agentic-vulnerability-scanner-llm-cli",
+  "name": "agentic-vulnerability-scanner-llm-ui",
   "version": "0.1.0",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
-      "name": "agentic-vulnerability-scanner-llm-cli",
+      "name": "agentic-vulnerability-scanner-llm-ui",
       "version": "0.1.0",
       "dependencies": {
         "core-js": "^3.8.3",
diff --git a/ui/package.json b/ui/package.json
index a096e73..743a877 100644
--- a/ui/package.json
+++ b/ui/package.json
@@ -4,6 +4,7 @@
   "private": true,
   "scripts": {
     "serve": "vue-cli-service serve ",
+    "dev": "vue-cli-service serve ",
     "build": "vue-cli-service build",
     "lint": "vue-cli-service lint"
   },