diff --git a/extensions/vertx-http/deployment/pom.xml b/extensions/vertx-http/deployment/pom.xml
index 2ba139c19f25c..464a4237a9d91 100644
--- a/extensions/vertx-http/deployment/pom.xml
+++ b/extensions/vertx-http/deployment/pom.xml
@@ -76,7 +76,17 @@
             <groupId>com.fasterxml.jackson.datatype</groupId>
             <artifactId>jackson-datatype-jdk8</artifactId>
         </dependency>
-
+        <dependency>
+            <groupId>io.quarkus</groupId>
+            <artifactId>quarkus-devtools-common</artifactId>
+            <exclusions>
+                <exclusion>
+                    <groupId>org.apache.maven.resolver</groupId>
+                    <artifactId>maven-resolver-connector-basic</artifactId>
+                </exclusion>
+            </exclusions>
+        </dependency>
+        
         <!-- Test dependencies -->
         <dependency>
             <groupId>io.quarkus</groupId>
diff --git a/extensions/vertx-http/deployment/src/main/java/io/quarkus/devui/deployment/menu/ExtensionsProcessor.java b/extensions/vertx-http/deployment/src/main/java/io/quarkus/devui/deployment/menu/ExtensionsProcessor.java
index 856d8d0fbf440..fe1b28b10c6e8 100644
--- a/extensions/vertx-http/deployment/src/main/java/io/quarkus/devui/deployment/menu/ExtensionsProcessor.java
+++ b/extensions/vertx-http/deployment/src/main/java/io/quarkus/devui/deployment/menu/ExtensionsProcessor.java
@@ -1,14 +1,35 @@
 package io.quarkus.devui.deployment.menu;
 
+import java.io.ByteArrayOutputStream;
+import java.io.PrintStream;
+import java.nio.file.Path;
+import java.nio.file.Paths;
+import java.util.ArrayList;
 import java.util.List;
 import java.util.Map;
+import java.util.Set;
+
+import com.fasterxml.jackson.databind.JsonNode;
+import com.fasterxml.jackson.databind.ObjectMapper;
 
 import io.quarkus.deployment.IsDevelopment;
+import io.quarkus.deployment.annotations.BuildProducer;
 import io.quarkus.deployment.annotations.BuildStep;
+import io.quarkus.deployment.builditem.LaunchModeBuildItem;
+import io.quarkus.dev.spi.DevModeType;
+import io.quarkus.devtools.commands.AddExtensions;
+import io.quarkus.devtools.commands.ListCategories;
+import io.quarkus.devtools.commands.ListExtensions;
+import io.quarkus.devtools.commands.RemoveExtensions;
+import io.quarkus.devtools.commands.data.QuarkusCommandOutcome;
+import io.quarkus.devtools.messagewriter.MessageWriter;
+import io.quarkus.devtools.project.QuarkusProject;
+import io.quarkus.devtools.project.QuarkusProjectHelper;
 import io.quarkus.devui.deployment.ExtensionsBuildItem;
 import io.quarkus.devui.deployment.InternalPageBuildItem;
 import io.quarkus.devui.deployment.extension.Extension;
 import io.quarkus.devui.deployment.extension.ExtensionGroup;
+import io.quarkus.devui.spi.buildtime.BuildTimeActionBuildItem;
 import io.quarkus.devui.spi.page.Page;
 
 /**
@@ -30,11 +51,167 @@ InternalPageBuildItem createExtensionsPages(ExtensionsBuildItem extensionsBuildI
 
         // Page
         extensionsPages.addPage(Page.webComponentPageBuilder()
-                .namespace("devui-extensions")
+                .namespace(NAMESPACE)
                 .title("Extensions")
                 .icon("font-awesome-solid:puzzle-piece")
                 .componentLink("qwc-extensions.js"));
 
         return extensionsPages;
     }
-}
\ No newline at end of file
+
+    @BuildStep(onlyIf = IsDevelopment.class)
+    void createBuildTimeActions(BuildProducer<BuildTimeActionBuildItem> buildTimeActionProducer,
+            LaunchModeBuildItem launchModeBuildItem) {
+
+        if (launchModeBuildItem.getDevModeType().isPresent()
+                && launchModeBuildItem.getDevModeType().get().equals(DevModeType.LOCAL)) {
+
+            ObjectMapper objectMapper = new ObjectMapper();
+
+            Path projectRoot = Paths.get(System.getProperty("user.dir")).toAbsolutePath();
+            QuarkusProject quarkusProject = QuarkusProjectHelper.getProject(projectRoot);
+
+            BuildTimeActionBuildItem buildTimeActions = new BuildTimeActionBuildItem(NAMESPACE);
+
+            getCategories(buildTimeActions, quarkusProject, objectMapper);
+            getInstallableExtensions(buildTimeActions, quarkusProject, objectMapper);
+            getInstalledNamespaces(buildTimeActions, quarkusProject, objectMapper);
+            removeExtension(buildTimeActions, quarkusProject);
+            addExtension(buildTimeActions, quarkusProject);
+            buildTimeActionProducer.produce(buildTimeActions);
+        }
+    }
+
+    private void getCategories(BuildTimeActionBuildItem buildTimeActions, QuarkusProject quarkusProject,
+            ObjectMapper objectMapper) {
+        buildTimeActions.addAction(new Object() {
+        }.getClass().getEnclosingMethod().getName(), ignored -> {
+            try (ByteArrayOutputStream byteArrayOutputStream = new ByteArrayOutputStream();
+                    PrintStream printStream = new PrintStream(byteArrayOutputStream)) {
+
+                QuarkusCommandOutcome outcome = new ListCategories(quarkusProject, MessageWriter.info(printStream))
+                        .format("json")
+                        .execute();
+
+                if (outcome.isSuccess()) {
+                    String jsonString = byteArrayOutputStream.toString();
+                    return objectMapper.readTree(jsonString);
+                }
+                return null;
+            } catch (Exception e) {
+                throw new RuntimeException(e);
+            }
+        });
+    }
+
+    private void getInstallableExtensions(BuildTimeActionBuildItem buildTimeActions, QuarkusProject quarkusProject,
+            ObjectMapper objectMapper) {
+        buildTimeActions.addAction(new Object() {
+        }.getClass().getEnclosingMethod().getName(), ignored -> {
+
+            try (ByteArrayOutputStream byteArrayOutputStream = new ByteArrayOutputStream();
+                    PrintStream printStream = new PrintStream(byteArrayOutputStream)) {
+
+                QuarkusCommandOutcome outcome = new ListExtensions(quarkusProject, MessageWriter.info(printStream))
+                        .installed(false)
+                        .all(false)
+                        .format("json")
+                        .execute();
+
+                if (outcome.isSuccess()) {
+                    String jsonString = byteArrayOutputStream.toString();
+                    return objectMapper.readTree(jsonString);
+                }
+
+                return null;
+            } catch (Exception e) {
+                throw new RuntimeException(e);
+            }
+        });
+    }
+
+    private void getInstalledNamespaces(BuildTimeActionBuildItem buildTimeActions, QuarkusProject quarkusProject,
+            ObjectMapper objectMapper) {
+        buildTimeActions.addAction(new Object() {
+        }.getClass().getEnclosingMethod().getName(), ignored -> {
+
+            try (ByteArrayOutputStream byteArrayOutputStream = new ByteArrayOutputStream();
+                    PrintStream printStream = new PrintStream(byteArrayOutputStream)) {
+
+                QuarkusCommandOutcome outcome = new ListExtensions(quarkusProject, MessageWriter.info(printStream))
+                        .installed(true)
+                        .all(false)
+                        .format("json")
+                        .execute();
+
+                if (outcome.isSuccess()) {
+                    String jsonString = byteArrayOutputStream.toString();
+                    JsonNode rootArrayNode = objectMapper.readTree(jsonString);
+                    List<String> namespaceList = new ArrayList<>();
+
+                    if (rootArrayNode.isArray()) {
+                        for (JsonNode jsonNode : rootArrayNode) {
+                            JsonNode artifactNode = jsonNode.path("artifact");
+                            String groupId = artifactNode.path("groupId").asText();
+                            String artifactId = artifactNode.path("artifactId").asText();
+                            namespaceList.add(groupId + "." + artifactId);
+                        }
+                    }
+                    return namespaceList;
+                }
+
+                return null;
+            } catch (Exception e) {
+                throw new RuntimeException(e);
+            }
+        });
+    }
+
+    private void removeExtension(BuildTimeActionBuildItem buildTimeActions, QuarkusProject quarkusProject) {
+        buildTimeActions.addAction(new Object() {
+        }.getClass().getEnclosingMethod().getName(), params -> {
+            String extensionArtifactId = params.get("extensionArtifactId");
+
+            try (ByteArrayOutputStream byteArrayOutputStream = new ByteArrayOutputStream();
+                    PrintStream printStream = new PrintStream(byteArrayOutputStream)) {
+
+                QuarkusCommandOutcome outcome = new RemoveExtensions(quarkusProject, MessageWriter.info(printStream))
+                        .extensions(Set.of(extensionArtifactId))
+                        .execute();
+
+                if (outcome.isSuccess()) {
+                    return true;
+                } else {
+                    return false;
+                }
+            } catch (Exception e) {
+                throw new RuntimeException(e);
+            }
+        });
+    }
+
+    private void addExtension(BuildTimeActionBuildItem buildTimeActions, QuarkusProject quarkusProject) {
+        buildTimeActions.addAction(new Object() {
+        }.getClass().getEnclosingMethod().getName(), params -> {
+            String extensionArtifactId = params.get("extensionArtifactId");
+
+            try (ByteArrayOutputStream byteArrayOutputStream = new ByteArrayOutputStream();
+                    PrintStream printStream = new PrintStream(byteArrayOutputStream)) {
+
+                QuarkusCommandOutcome outcome = new AddExtensions(quarkusProject, MessageWriter.info(printStream))
+                        .extensions(Set.of(extensionArtifactId))
+                        .execute();
+
+                if (outcome.isSuccess()) {
+                    return true;
+                } else {
+                    return false;
+                }
+            } catch (Exception e) {
+                throw new RuntimeException(e);
+            }
+        });
+    }
+
+    private static final String NAMESPACE = "devui-extensions";
+}
diff --git a/extensions/vertx-http/dev-ui-resources/src/main/resources/dev-ui/qwc/qwc-configuration.js b/extensions/vertx-http/dev-ui-resources/src/main/resources/dev-ui/qwc/qwc-configuration.js
index ee3729fd0beba..ae022d1abe8c4 100644
--- a/extensions/vertx-http/dev-ui-resources/src/main/resources/dev-ui/qwc/qwc-configuration.js
+++ b/extensions/vertx-http/dev-ui-resources/src/main/resources/dev-ui/qwc/qwc-configuration.js
@@ -252,9 +252,9 @@ export class QwcConfiguration extends observeState(LitElement) {
         return html`<vaadin-grid .items="${this._filtered}" style="width: 100%;" class="${className}" theme="row-stripes"
                                 .detailsOpenedItems="${this._detailsOpenedItem}"
                                 @active-item-changed="${(event) => {
-                                const prop = event.detail.value;
-                                this._detailsOpenedItem = prop ? [prop] : [];
-                            }}"
+                                    const prop = event.detail.value;
+                                    this._detailsOpenedItem = prop ? [prop] : [];
+                                }}"
                             ${gridRowDetailsRenderer(this._descriptionRenderer, [])}
                         >
                         <vaadin-grid-sort-column auto-width class="cell" flex-grow="0" path="configPhase" header='Phase'
diff --git a/extensions/vertx-http/dev-ui-resources/src/main/resources/dev-ui/qwc/qwc-extension-add.js b/extensions/vertx-http/dev-ui-resources/src/main/resources/dev-ui/qwc/qwc-extension-add.js
new file mode 100644
index 0000000000000..b6ba413df1026
--- /dev/null
+++ b/extensions/vertx-http/dev-ui-resources/src/main/resources/dev-ui/qwc/qwc-extension-add.js
@@ -0,0 +1,359 @@
+import { QwcHotReloadElement, html, css} from 'qwc-hot-reload-element';
+import { JsonRpc } from 'jsonrpc';
+import '@vaadin/text-field';
+import '@vaadin/icon';
+import '@vaadin/progress-bar';
+import '@vaadin/combo-box';
+import '@vaadin/details';
+import '@vaadin/grid';
+import '@vaadin/grid/vaadin-grid-sort-column.js';
+import '@qomponent/qui-badge';
+import { gridRowDetailsRenderer } from '@vaadin/grid/lit.js';
+
+/**
+ * This component create the add extensions screen
+ */
+export class QwcExtensionAdd extends QwcHotReloadElement {
+    jsonRpc = new JsonRpc("devui-extensions", false);
+    
+    static styles = css`
+        .dialogContent {
+            display: flex;
+            width: 75vw;
+            height: 80vh;
+            flex-direction: column;
+        }
+    
+        .grid {
+            width: 100%;
+            height: 100%;
+        }
+    
+        .descriptionPane{
+            display: flex;
+            padding-left: 30px;
+            padding-right: 30px;
+            padding-top: 10px;
+            padding-bottom: 10px;
+            justify-content: space-between;
+            gap: 10px;
+        }
+    
+        .description {
+            display: flex;
+            flex-direction: column;
+            color: var(--lumo-contrast-60pct);
+            width: 100%;
+        }
+    
+        a, a:visited {
+            text-decoration: none;
+            color: var(--lumo-contrast-60pct);
+        }
+        a:hover {
+            color: var(--lumo-primary-color);
+        }
+        
+        .line{
+            padding-bottom: 3px;
+        }
+        .list{
+            display: flex;
+            align-items: center;
+        }
+        .install {
+            position: absolute;
+            top: 20px;
+            right: 20px;
+        }
+        .filterbar {
+            display: flex;
+            gap: 10px;
+            justify-content: space-between;
+        }
+    `;
+
+    static properties = {
+        _extensions: {state: true, type: Array},
+        _categories: {state: true, type: Array},
+        _filteredExtensions: {state: true, type: Array},
+        _filteredValue: {state: true},
+        _filteredCategory: {state: true},
+        _detailsOpenedItem: {state: true, type: Array},
+    }
+
+    constructor() {
+        super();
+        this._extensions = null;
+        this._categories = null;
+        this._filteredExtensions = null;
+        this._filteredValue = null;
+        this._filteredCategory = null;
+        this._detailsOpenedItem = [];
+    }
+
+    connectedCallback() {
+        super.connectedCallback();
+        
+        this.jsonRpc.getCategories().then(jsonRpcResponse => {
+            this._categories = jsonRpcResponse.result;
+            this._categories.push({name:'Uncategorised', id: 'uncategorised'});
+        });
+        
+        if(!this._extensions){
+            this.hotReload();
+        }
+    }
+
+    hotReload(){
+        this.jsonRpc.getInstallableExtensions().then(jsonRpcResponse => {
+            this._extensions = jsonRpcResponse.result;
+            this._filteredExtensions = this._extensions;
+        });
+    }
+
+    render() {
+        if(this._filteredExtensions){
+            return html`<div class="dialogContent">
+                            ${this._renderFilterBar()}
+                            ${this._renderGrid()}
+                        </div>`;
+        }else{
+            return html`<vaadin-progress-bar class="progress" indeterminate></vaadin-progress-bar>`;
+        }
+    }
+
+    _renderGrid(){
+        return html`<vaadin-grid .items="${this._filteredExtensions}" class="grid" theme="row-stripes"
+                        .detailsOpenedItems="${this._detailsOpenedItem}"
+                            @active-item-changed="${(event) => {
+                                const prop = event.detail.value;
+                                this._detailsOpenedItem = prop ? [prop] : [];
+                            }}"
+                            ${gridRowDetailsRenderer(this._descriptionRenderer, [])}>
+                            <vaadin-grid-sort-column header="Name" path="name" auto-width flex-grow="0" resizable></vaadin-grid-sort-column>
+                            <vaadin-grid-sort-column header="Description" path="description" resizable></vaadin-grid-sort-column>
+                        </vaadin-grid>`;
+    }
+
+    _renderFilterBar(){
+        return html`<div class="filterbar">
+                        <vaadin-text-field style="width: 100%;"
+                                placeholder="Filter"
+                                value="${this._filteredValue}"
+                                @value-changed="${(e) => this._filterTextChanged(e)}">
+                            <vaadin-icon slot="prefix" icon="font-awesome-solid:filter"></vaadin-icon>
+                            <qui-badge slot="suffix"><span>${this._filteredExtensions.length}</span></qui-badge>
+                        </vaadin-text-field>
+                        ${this._renderCategoryDropdown()}
+                    </div>`;
+        
+    }
+
+    _renderCategoryDropdown(){
+        if(this._categories){
+            return html`<vaadin-combo-box
+                            placeholder="Category"
+                            item-label-path="name"
+                            item-value-path="id"
+                            .items="${this._categories}"
+                            @value-changed="${(e) => this._filterCategoryChanged(e)}"
+                            clear-button-visible
+                        ></vaadin-combo-box>`;
+        }
+    }
+
+    _filterCategoryChanged(e){
+        this._filteredCategory = (e.detail.value || '').trim();
+        return this._filterGrid();
+    }
+
+    _filterTextChanged(e) {
+        this._filteredValue = (e.detail.value || '').trim();
+        return this._filterGrid();
+    }
+
+    _filterGrid(){
+        this._filteredExtensions = this._extensions.filter((prop) => {
+            if(this._filteredValue && this._filteredValue !== '' && this._filteredCategory && this._filteredCategory !== ''){
+                return this._filterByTerm(prop) && this._filterByCategory(prop);
+            }else if(this._filteredValue && this._filteredValue !== ''){
+                 return this._filterByTerm(prop);
+            }else if(this._filteredCategory && this._filteredCategory !== ''){
+                return this._filterByCategory(prop);
+            }else{
+                return true;
+            }
+        });
+    }
+
+    _filterByTerm(prop){
+        if(prop.metadata && prop.metadata.keywords){
+            return this._match(prop.name, this._filteredValue) || this._match(prop.description, this._filteredValue) || prop.metadata.keywords.includes(this._filteredValue);
+        }else{
+            return this._match(prop.name, this._filteredValue) || this._match(prop.description, this._filteredValue);
+        }
+    }
+
+    _filterByCategory(prop){
+        if(prop.metadata && prop.metadata.categories){
+            return prop.metadata.categories.includes(this._filteredCategory);
+        }else if(this._filteredCategory === "uncategorised"){
+            return true;
+        }else {
+            return false;
+        }
+    }
+
+    _match(value, term) {
+        if (! value) {
+            return false;
+        }
+        
+        return value.toLowerCase().includes(term.toLowerCase());
+    }
+
+    _descriptionRenderer(prop) {
+        
+        return html`<div class="descriptionPane">
+                        <div class="description">
+                            <span class="line"><b>Artifact:</b> ${prop.artifact.groupId}:${prop.artifact.artifactId}</span>
+                            <span class="line"><b>Version:</b> ${prop.artifact.version}</span>
+                            ${this._renderIsPlatform(prop)}
+                            ${this._renderMetadata1(prop)}
+                        </div>
+                        <div class="description">
+                            ${this._renderMetadata2(prop)}
+                        </div>
+                    </div>
+                    <vaadin-button class="install" theme="secondary success" @click="${() => this._install(prop)}">
+                        <vaadin-icon icon="font-awesome-solid:download" slot="prefix"></vaadin-icon>
+                        Install
+                    </vaadin-button>    
+                    `;
+    }
+
+    _renderMetadata1(prop){
+        if(prop.metadata){
+            return html`${this._renderGuide(prop.metadata)}
+                        ${this._renderScmUrl(prop.metadata)}
+                        ${this._renderStatus(prop.metadata)}
+                        ${this._renderMinJavaVersion(prop.metadata)}`;
+        }
+    }
+
+    _renderIsPlatform(prop){
+        if (prop.origins && prop.origins.some(str => str.startsWith("io.quarkus:quarkus-bom-quarkus-platform"))){
+            return html`<span class="line"><b>Platform:</b> <vaadin-icon style="height: var(--lumo-icon-size-s); width: var(--lumo-icon-size-s);" icon="font-awesome-solid:check"></vaadin-icon></span>`;
+        } else {
+            return html`<span class="line"><b>Platform:</b> <vaadin-icon style="height: var(--lumo-icon-size-s); width: var(--lumo-icon-size-s);" icon="font-awesome-solid:xmark"></vaadin-icon></span>`;
+        } 
+    }
+
+    _renderGuide(metadata){
+       if (metadata.guide){
+           return html`<span class="line"><b>Guide:</b> <a target="_blank" href="${metadata.guide}">${metadata.guide}</a></span>`;
+        } 
+    }
+
+    _renderScmUrl(metadata){
+        if (metadata['scm-url']){
+           return html`<span class="line"><b>SCM:</b> <a target="_blank" href="${metadata['scm-url']}">${metadata['scm-url']}</a></span>`;     
+        }
+    }
+    
+    _renderStatus(metadata){
+        if(metadata.status){
+            return html`<span class="line"><b>Status:</b> <qui-badge level="${this._statusLevel(metadata.status)}" small><span>${metadata.status.toUpperCase()}</span></qui-badge></span>`;     
+        }
+    }
+    
+    _renderMinJavaVersion(metadata){
+        if(metadata['minimum-java-version']){
+           return html`<span class="line"><b>Minimum Java version:</b> ${metadata['minimum-java-version']}</span>`;     
+        }
+    }
+
+    _renderMetadata2(prop){
+        if(prop.metadata){
+            return html`${this._renderKeywords(prop.metadata)}
+                        ${this._renderCategories(prop.metadata)}
+                        ${this._renderExtensionDependencies(prop.metadata)}`;
+        }
+    }
+
+    
+
+    
+    
+    _statusLevel(s){
+        if(s === "stable") {
+            return "success";
+        } else if(s === "experimental") {
+            return "warning";
+        } else if(s === "preview") {
+            return "contrast";   
+        }
+        return null;
+    }
+    
+    _renderCategories(metadata){
+        if(metadata.categories){
+           return this._renderList("Categories", metadata.categories);
+        }
+    }
+    
+    _renderKeywords(metadata){
+        if(metadata.keywords){
+           return this._renderList("Keywords", metadata.keywords);
+        }
+    }
+    
+    _renderExtensionDependencies(metadata){
+        if(metadata['extension-dependencies']){
+           return html`<vaadin-details summary="Extension dependencies">
+                            <vaadin-vertical-layout>
+                                ${this._renderExtensionDependenciesLines(metadata['extension-dependencies'])}
+                            </vaadin-vertical-layout>
+                        </vaadin-details>`;     
+        }
+    }
+    
+    _renderExtensionDependenciesLines(lines){
+        return html`
+            ${lines.map((line) =>
+                html`<span>${line}</span>`
+            )}
+        `;
+    }
+    
+    _renderList(heading, list) {
+        return html`<span class="list"><b>${heading}:</b> ${this._renderListLines(list)}</span>`;
+    }
+    
+    _renderListLines(list) {
+        return html`
+          <ul>
+            ${list.map((item) =>
+                html`<li>${item}</li>`
+            )}
+          </ul>
+        `;
+    }
+    
+    _install(prop){
+        let extensionArtifactId = prop.artifact.groupId + ':' + prop.artifact.artifactId;
+        this.jsonRpc.addExtension({extensionArtifactId:extensionArtifactId}).then(jsonRpcResponse => {
+            let outcome = jsonRpcResponse.result;
+            
+            const options = {
+                detail: {outcome: outcome, name: prop.name},
+                bubbles: true,
+                composed: true,
+            };
+            this.dispatchEvent(new CustomEvent('inprogress', options));
+            
+        });   
+    }
+}
+customElements.define('qwc-extension-add', QwcExtensionAdd);
diff --git a/extensions/vertx-http/dev-ui-resources/src/main/resources/dev-ui/qwc/qwc-extension.js b/extensions/vertx-http/dev-ui-resources/src/main/resources/dev-ui/qwc/qwc-extension.js
index 5c76cb0bfe8bd..7a2d7d73b8b69 100644
--- a/extensions/vertx-http/dev-ui-resources/src/main/resources/dev-ui/qwc/qwc-extension.js
+++ b/extensions/vertx-http/dev-ui-resources/src/main/resources/dev-ui/qwc/qwc-extension.js
@@ -1,14 +1,19 @@
 import { LitElement, html, css} from 'lit';
+import { observeState } from 'lit-element-state';
 import '@vaadin/icon';
 import '@vaadin/dialog';
 import { dialogHeaderRenderer, dialogRenderer } from '@vaadin/dialog/lit.js';
 import '@qomponent/qui-badge';
+import { JsonRpc } from 'jsonrpc';
+import { notifier } from 'notifier';
+import { connectionState } from 'connection-state';
 
 /**
  * This component represent one extension
  * It's a card on the extension board
  */
-export class QwcExtension extends LitElement {
+export class QwcExtension extends observeState(LitElement) {
+    jsonRpc = new JsonRpc("devui-extensions", false);
 
     static styles = css`
         .card {
@@ -95,13 +100,15 @@ export class QwcExtension extends LitElement {
         builtWith: {type: String},
         providesCapabilities: {},
         extensionDependencies: {}, 
-        favourite: {type: Boolean},   
+        favourite: {type: Boolean},
+        installed: {type: Boolean},
     };
     
     constructor() {
         super();
         this._dialogOpened = false;
         this.favourite = false;
+        this.installed = false;
     }
 
     render() {
@@ -260,9 +267,30 @@ export class QwcExtension extends LitElement {
                     <td>${this._renderExtensionDependencies()}</td>
                 </tr>
             </table>
+            ${this._renderUninstallButton()}
         `;
     }
 
+    _renderUninstallButton(){
+        if(connectionState.current.isConnected && this.installed){
+            return html`<vaadin-button style="width: 100%;" theme="secondary error" @click="${this._uninstall}">
+                        <vaadin-icon icon="font-awesome-solid:trash-can" slot="prefix"></vaadin-icon>
+                        Remove this extension
+                    </vaadin-button>`;
+        }
+    }
+
+    _uninstall(){
+        this._dialogOpened = false;
+        notifier.showInfoMessage(this.name + " removal in progess");
+        this.jsonRpc.removeExtension({extensionArtifactId:this.artifact}).then(jsonRpcResponse => {
+            let outcome = jsonRpcResponse.result;
+            if(!outcome){
+                notifier.showErrorMessage(name + " removal failed");
+            }
+        });
+    }
+
     _renderGuideDetails() {
         return this.guide
           ? html`<span style="cursor:pointer" @click=${this._guide}>${this.guide}</span>`
diff --git a/extensions/vertx-http/dev-ui-resources/src/main/resources/dev-ui/qwc/qwc-extensions.js b/extensions/vertx-http/dev-ui-resources/src/main/resources/dev-ui/qwc/qwc-extensions.js
index d555580dcaf02..5c5ec21f91d9e 100644
--- a/extensions/vertx-http/dev-ui-resources/src/main/resources/dev-ui/qwc/qwc-extensions.js
+++ b/extensions/vertx-http/dev-ui-resources/src/main/resources/dev-ui/qwc/qwc-extensions.js
@@ -5,15 +5,21 @@ import { devuiState } from 'devui-state';
 import { observeState } from 'lit-element-state';
 import 'qwc/qwc-extension.js';
 import 'qwc/qwc-extension-link.js';
+import 'qwc/qwc-extension-add.js';
 import { StorageController } from 'storage-controller';
-
+import '@vaadin/dialog';
+import { dialogHeaderRenderer, dialogRenderer } from '@vaadin/dialog/lit.js';
+import { notifier } from 'notifier';
+import { connectionState } from 'connection-state';
+import { JsonRpc } from 'jsonrpc';
+import '@vaadin/progress-bar';
 /**
  * This component create cards of all the extensions
  */
 export class QwcExtensions extends observeState(LitElement) {
     routerController = new RouterController(this);
     storageController = new StorageController(this);
-    
+    jsonRpc = new JsonRpc("devui-extensions", false);
     static styles = css`
         .grid {
             display: flex;
@@ -49,22 +55,51 @@ export class QwcExtensions extends observeState(LitElement) {
         qwc-extension-link {
             cursor: grab;
         }
+        .addExtensionButton {
+            position: absolute;
+            bottom: 40px;
+            right: 40px;
+            width: 3em;
+            height: 3em;
+            box-shadow: var(--lumo-shade) 5px 5px 15px 3px;
+        }
+        .addExtensionIcon {
+            width: 2em;
+            height: 2em;
+        }
        `;
 
     static properties = {
         _favourites: {state: true},
+        _addDialogOpened: {state: true},
+        _installedExtensions: {state: true, type: Array},
     }
 
     constructor() {
         super();
         this._favourites = this._getStoredFavourites();
+        this._addDialogOpened = false;
+        this._installedExtensions = null;
+    }
+
+    connectedCallback() {
+        super.connectedCallback();
+        this.jsonRpc.getInstalledNamespaces().then(jsonRpcResponse => {
+            this._installedExtensions = jsonRpcResponse.result;
+        });
     }
 
     render() {
-        return html`<div class="grid">
-            ${this._renderActives(devuiState.cards.active)}
-            ${devuiState.cards.inactive.map(extension => this._renderInactive(extension))}
-          </div>`;
+        if(this._installedExtensions){
+            return html`<div class="grid">
+                ${this._renderActives(devuiState.cards.active)}
+                ${devuiState.cards.inactive.map(extension => this._renderInactive(extension))}
+            </div>
+            ${this._renderAddDialog()}`;
+        }else{
+            return html`<label class="text-secondary" id="pblabel">Loading extensions</label>
+                    <vaadin-progress-bar aria-labelledby="pblabel" class="progress" indeterminate></vaadin-progress-bar>`;
+        }
     }
 
     _renderActives(extensions){
@@ -97,7 +132,7 @@ export class QwcExtensions extends observeState(LitElement) {
     }
 
     _renderActive(extension, fav){
-
+        let installed = this._installedExtensions.includes(extension.namespace);
         return html`
                 <qwc-extension 
                     clazz="active"
@@ -115,6 +150,7 @@ export class QwcExtensions extends observeState(LitElement) {
                     builtWith="${extension.builtWith}"
                     providesCapabilities="${extension.providesCapabilities}"
                     extensionDependencies="${extension.extensionDependencies}"
+                    ?installed=${installed}
                     ?favourite=${fav} 
                     @favourite=${this._favourite}>
 
@@ -243,5 +279,55 @@ export class QwcExtensions extends observeState(LitElement) {
             </qwc-extension>`;
         }
     }
+    
+    _renderAddDialog(){
+        return html`
+            <vaadin-dialog
+              theme="no-padding"
+              resizable
+              draggable
+              header-title="Add extension"
+              .opened="${this._addDialogOpened}"
+              @opened-changed="${(event) => {
+                this._addDialogOpened = event.detail.value;
+              }}"
+              ${dialogHeaderRenderer(
+                  () => html`
+                    <vaadin-button theme="tertiary" @click="${() => (this._addDialogOpened = false)}">
+                        <vaadin-icon icon="font-awesome-solid:xmark"></vaadin-icon>
+                    </vaadin-button>
+                  `,
+                  []
+                )}
+              ${dialogRenderer(
+                () => html`<qwc-extension-add @inprogress="${this._installRequest}"></qwc-extension-add>`
+              )}
+            ></vaadin-dialog>
+            ${this._renderAddExtensionButton()}
+          `;
+    }
+    
+    _renderAddExtensionButton(){
+        if(connectionState.current.isConnected){
+            return html`<vaadin-button class="addExtensionButton" theme="icon" aria-label="Add extension" title="Add extension" @click="${this._openAddDialog}">
+                        <vaadin-icon class="addExtensionIcon" icon="font-awesome-solid:plus"></vaadin-icon>
+                    </vaadin-button>`;
+        }
+    }
+    
+    _installRequest(e){
+        this._addDialogOpened = false;
+        let name = e.detail.name;
+        if(e.detail.outcome){
+            notifier.showInfoMessage(name + " instalation in progess");
+        }else{
+            notifier.showErrorMessage(name + " instalation failed");
+        }
+    }
+    
+    _openAddDialog() {
+        this._addDialogOpened = true;
+    }
+
 }
 customElements.define('qwc-extensions', QwcExtensions);
diff --git a/independent-projects/tools/devtools-common/src/main/java/io/quarkus/devtools/commands/handlers/ListCategoriesCommandHandler.java b/independent-projects/tools/devtools-common/src/main/java/io/quarkus/devtools/commands/handlers/ListCategoriesCommandHandler.java
index e7a6a5f6ae4c3..d9cbaf581c90d 100644
--- a/independent-projects/tools/devtools-common/src/main/java/io/quarkus/devtools/commands/handlers/ListCategoriesCommandHandler.java
+++ b/independent-projects/tools/devtools-common/src/main/java/io/quarkus/devtools/commands/handlers/ListCategoriesCommandHandler.java
@@ -2,7 +2,12 @@
 
 import java.util.Collection;
 import java.util.Comparator;
+import java.util.List;
 import java.util.function.BiConsumer;
+import java.util.stream.Collectors;
+
+import com.fasterxml.jackson.core.JsonProcessingException;
+import com.fasterxml.jackson.databind.ObjectMapper;
 
 import io.quarkus.devtools.commands.ListCategories;
 import io.quarkus.devtools.commands.data.QuarkusCommandException;
@@ -20,6 +25,7 @@ public class ListCategoriesCommandHandler implements QuarkusCommandHandler {
     private static final String ID_FORMAT = "%-20s";
     private static final String CONCISE_FORMAT = "%-50s %-50s";
     private static final String FULL_FORMAT = "%-30s %-20s %s";
+    private ObjectMapper objectMapper = new ObjectMapper();
 
     @Override
     public QuarkusCommandOutcome execute(QuarkusCommandInvocation invocation) throws QuarkusCommandException {
@@ -30,13 +36,16 @@ public QuarkusCommandOutcome execute(QuarkusCommandInvocation invocation) throws
 
         final Collection<Category> categories = invocation.getExtensionsCatalog().getCategories();
 
-        if (!batchMode) {
+        if (!batchMode && !format.equalsIgnoreCase("json")) {
             log.info("Available Quarkus extension categories: ");
             log.info("");
         }
 
         BiConsumer<MessageWriter, Category> formatter;
         switch (format.toLowerCase()) {
+            case "json":
+                formatter = null;
+                break;
             case "full":
                 log.info(String.format(FULL_FORMAT, "Category", "CategoryId", "Description"));
                 formatter = this::fullFormatter;
@@ -50,10 +59,22 @@ public QuarkusCommandOutcome execute(QuarkusCommandInvocation invocation) throws
                 break;
         }
 
-        categories.stream()
-                .sorted(Comparator.comparing(Category::getName))
-                .forEach(c -> formatter.accept(log, c));
+        if (formatter != null) {
+            categories.stream()
+                    .sorted(Comparator.comparing(Category::getName))
+                    .forEach(c -> formatter.accept(log, c));
+        } else {
+            try {
+                List<Category> sortedCategories = categories.stream()
+                        .sorted(Comparator.comparing(Category::getName))
+                        .collect(Collectors.toList());
 
+                log.info(objectMapper.writeValueAsString(sortedCategories));
+            } catch (JsonProcessingException ex) {
+                ex.printStackTrace();
+                log.info("[]");
+            }
+        }
         return QuarkusCommandOutcome.success();
     }
 
diff --git a/independent-projects/tools/devtools-common/src/main/java/io/quarkus/devtools/commands/handlers/ListExtensionsCommandHandler.java b/independent-projects/tools/devtools-common/src/main/java/io/quarkus/devtools/commands/handlers/ListExtensionsCommandHandler.java
index ca7154bc9f64c..7cb492b74dd1e 100644
--- a/independent-projects/tools/devtools-common/src/main/java/io/quarkus/devtools/commands/handlers/ListExtensionsCommandHandler.java
+++ b/independent-projects/tools/devtools-common/src/main/java/io/quarkus/devtools/commands/handlers/ListExtensionsCommandHandler.java
@@ -16,6 +16,9 @@
 import java.util.function.Predicate;
 import java.util.stream.Collectors;
 
+import com.fasterxml.jackson.core.JsonProcessingException;
+import com.fasterxml.jackson.databind.ObjectMapper;
+
 import io.quarkus.devtools.commands.ListExtensions;
 import io.quarkus.devtools.commands.data.QuarkusCommandException;
 import io.quarkus.devtools.commands.data.QuarkusCommandInvocation;
@@ -43,6 +46,8 @@ public class ListExtensionsCommandHandler implements QuarkusCommandHandler {
     private static final String ORIGINS_FORMAT = "%-1s %-50s %-50s %-25s %s";
     private static final String FULL_FORMAT = "%-1s %-50s %-60s %-25s %s";
 
+    private ObjectMapper objectMapper = new ObjectMapper();
+
     @Override
     public QuarkusCommandOutcome execute(QuarkusCommandInvocation invocation) throws QuarkusCommandException {
 
@@ -61,11 +66,15 @@ public QuarkusCommandOutcome execute(QuarkusCommandInvocation invocation) throws
                         .getExtensions();
 
         if (extensions.isEmpty()) {
-            log.info("No extension found with pattern '%s'", search);
+            if (format.equalsIgnoreCase("json")) {
+                log.info("[]");
+            } else {
+                log.info("No extension found with pattern '%s'", search);
+            }
             return QuarkusCommandOutcome.success();
         }
 
-        if (!batchMode) {
+        if (!batchMode && !format.equalsIgnoreCase("json")) {
             String extensionStatus = all ? "available" : "installable";
             if (installedOnly)
                 extensionStatus = "installed";
@@ -75,6 +84,9 @@ public QuarkusCommandOutcome execute(QuarkusCommandInvocation invocation) throws
 
         BiConsumer<MessageWriter, DisplayData> currentFormatter;
         switch (format.toLowerCase()) {
+            case "json":
+                currentFormatter = null;
+                break;
             case "id":
             case "name":
                 currentFormatter = this::idFormatter;
@@ -110,11 +122,36 @@ public QuarkusCommandOutcome execute(QuarkusCommandInvocation invocation) throws
             categoryFilter = e -> true;
         }
 
-        extensions.stream()
-                .filter(e -> !ExtensionProcessor.of(e).isUnlisted())
-                .filter(categoryFilter)
-                .sorted(Comparator.comparing(e -> e.getArtifact().getArtifactId()))
-                .forEach(e -> display(log, e, installedByKey.get(toKey(e)), all, installedOnly, currentFormatter));
+        if (currentFormatter != null) {
+            extensions.stream()
+                    .filter(e -> !ExtensionProcessor.of(e).isUnlisted())
+                    .filter(categoryFilter)
+                    .sorted(Comparator.comparing(e -> e.getArtifact().getArtifactId()))
+                    .forEach(e -> display(log, e, installedByKey.get(toKey(e)), all, installedOnly, currentFormatter));
+        } else {
+            try {
+                List<Extension> filteredExtensions = extensions.stream()
+                        .filter(e -> !ExtensionProcessor.of(e).isUnlisted())
+                        .filter(categoryFilter)
+                        .filter(e -> {
+                            ArtifactCoords installed = installedByKey.get(toKey(e));
+                            if (installedOnly && installed == null) {
+                                return false;
+                            }
+                            if (!installedOnly && !all && installed != null) {
+                                return false;
+                            }
+                            return true;
+                        })
+                        .sorted(Comparator.comparing(e -> e.getArtifact().getArtifactId()))
+                        .collect(Collectors.toList());
+
+                log.info(objectMapper.writeValueAsString(filteredExtensions));
+            } catch (JsonProcessingException ex) {
+                ex.printStackTrace();
+                log.info("[]");
+            }
+        }
 
         return QuarkusCommandOutcome.success();
     }