diff --git a/package.json b/package.json
index e5b2601..5991ee2 100644
--- a/package.json
+++ b/package.json
@@ -2,7 +2,7 @@
   "publisher": "YRM",
   "name": "starter-templates",
   "displayName": "Starter Templates",
-  "version": "0.3.0",
+  "version": "0.4.0",
   "description": "Kickstart your project with a Starter Template in VSCode",
   "license": "MIT",
   "repository": {
diff --git a/resources/nuxt.svg b/resources/nuxt.svg
new file mode 100644
index 0000000..cd4669b
--- /dev/null
+++ b/resources/nuxt.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32"><path fill="#00DC82" d="M17.708 25h10.409c.33 0 .655-.088.942-.254a1.89 1.89 0 0 0 .689-.696a1.913 1.913 0 0 0 0-1.9L22.756 9.936a1.87 1.87 0 0 0-3.261 0l-1.788 3.125l-3.494-6.111a1.871 1.871 0 0 0-3.262 0l-8.7 15.2a1.912 1.912 0 0 0 .69 2.595c.286.167.61.255.941.255h6.534c2.589 0 4.498-1.147 5.811-3.385l3.19-5.572l1.708-2.982l5.127 8.957h-6.835zm-7.398-2.985l-4.56-.001l6.836-11.942l3.41 5.97l-2.283 3.992c-.873 1.452-1.864 1.981-3.403 1.981"/></svg>
\ No newline at end of file
diff --git a/resources/ts.svg b/resources/ts.svg
new file mode 100644
index 0000000..5cad3ab
--- /dev/null
+++ b/resources/ts.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32"><rect width="28" height="28" x="2" y="2" fill="#3178c6" rx="1.312"/><path fill="#fff" fill-rule="evenodd" d="M18.245 23.759v3.068a6.492 6.492 0 0 0 1.764.575a11.56 11.56 0 0 0 2.146.192a9.968 9.968 0 0 0 2.088-.211a5.11 5.11 0 0 0 1.735-.7a3.542 3.542 0 0 0 1.181-1.266a4.469 4.469 0 0 0 .186-3.394a3.409 3.409 0 0 0-.717-1.117a5.236 5.236 0 0 0-1.123-.877a12.027 12.027 0 0 0-1.477-.734q-.6-.249-1.08-.484a5.5 5.5 0 0 1-.813-.479a2.089 2.089 0 0 1-.516-.518a1.091 1.091 0 0 1-.181-.618a1.039 1.039 0 0 1 .162-.571a1.4 1.4 0 0 1 .459-.436a2.439 2.439 0 0 1 .726-.283a4.211 4.211 0 0 1 .956-.1a5.942 5.942 0 0 1 .808.058a6.292 6.292 0 0 1 .856.177a5.994 5.994 0 0 1 .836.3a4.657 4.657 0 0 1 .751.422V13.9a7.509 7.509 0 0 0-1.525-.4a12.426 12.426 0 0 0-1.9-.129a8.767 8.767 0 0 0-2.064.235a5.239 5.239 0 0 0-1.716.733a3.655 3.655 0 0 0-1.171 1.271a3.731 3.731 0 0 0-.431 1.845a3.588 3.588 0 0 0 .789 2.34a6 6 0 0 0 2.395 1.639q.63.26 1.175.509a6.458 6.458 0 0 1 .942.517a2.463 2.463 0 0 1 .626.585a1.2 1.2 0 0 1 .23.719a1.1 1.1 0 0 1-.144.552a1.269 1.269 0 0 1-.435.441a2.381 2.381 0 0 1-.726.292a4.377 4.377 0 0 1-1.018.105a5.773 5.773 0 0 1-1.969-.35a5.874 5.874 0 0 1-1.805-1.045m-5.154-7.638h4v-2.527H5.938v2.527H9.92v11.254h3.171Z"/></svg>
\ No newline at end of file
diff --git a/resources/vue.svg b/resources/vue.svg
new file mode 100644
index 0000000..d3e84de
--- /dev/null
+++ b/resources/vue.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32"><path fill="#41b883" d="M24.4 3.925H30l-14 24.15L2 3.925h10.71l3.29 5.6l3.22-5.6Z"/><path fill="#41b883" d="m2 3.925l14 24.15l14-24.15h-5.6L16 18.415L7.53 3.925Z"/><path fill="#35495e" d="M7.53 3.925L16 18.485l8.4-14.56h-5.18L16 9.525l-3.29-5.6Z"/></svg>
\ No newline at end of file
diff --git a/resources/web-ext.svg b/resources/web-ext.svg
new file mode 100644
index 0000000..2d12e33
--- /dev/null
+++ b/resources/web-ext.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="36.74" height="32" viewBox="0 0 256 223"><defs><linearGradient id="logosChromeWebStore0" x1="0%" x2="100%" y1="50%" y2="50%"><stop offset="0%" stop-color="#D93025"/><stop offset="100%" stop-color="#EA4335"/></linearGradient><linearGradient id="logosChromeWebStore1" x1="74.943%" x2="19.813%" y1="95.826%" y2="-4.161%"><stop offset="0%" stop-color="#1E8E3E"/><stop offset="100%" stop-color="#34A853"/></linearGradient><linearGradient id="logosChromeWebStore2" x1="59.898%" x2="21.416%" y1="-.134%" y2="99.86%"><stop offset="0%" stop-color="#FBBC04"/><stop offset="100%" stop-color="#FCC934"/></linearGradient><path id="logosChromeWebStore3" d="M255.983 0H0v204.837c0 9.633 7.814 17.464 17.464 17.464h221.072c9.633 0 17.464-7.814 17.464-17.464z"/></defs><path fill="#F1F3F4" d="M255.983 0H0v204.837c0 9.633 7.814 17.464 17.464 17.464h221.072c9.633 0 17.464-7.814 17.464-17.464z"/><path fill="#E8EAED" d="M0 0h255.983v111.74H0z"/><path fill="#FFF" d="M157.076 47.727H98.907A11.63 11.63 0 0 1 87.27 36.09a11.63 11.63 0 0 1 11.637-11.637h58.169a11.63 11.63 0 0 1 11.637 11.637c0 6.417-5.204 11.637-11.637 11.637"/><mask id="logosChromeWebStore4" fill="#fff"><use href="#logosChromeWebStore3"/></mask><g mask="url(#logosChromeWebStore4)"><g transform="translate(17.455 94.293)"><path fill="url(#logosChromeWebStore0)" d="m14.812 55.255l15.241 46.498l32.638 36.427l47.845-82.908l95.724-.017C187.146 22.213 151.443 0 110.536 0C69.63 0 33.926 22.213 14.812 55.255"/><path fill="url(#logosChromeWebStore1)" d="m110.52 221.105l32.637-36.443l15.224-46.482H62.674L14.812 55.255c-19.047 33.076-20.445 75.128.017 110.561c20.445 35.434 57.545 55.256 95.69 55.29"/><path fill="url(#logosChromeWebStore2)" d="M206.26 55.272h-95.724l47.862 82.908l-47.862 82.925c38.162-.033 75.263-19.855 95.708-55.289c20.461-35.433 19.064-77.468.016-110.544"/><ellipse cx="110.536" cy="110.544" fill="#F1F3F4" rx="55.255" ry="55.272"/><ellipse cx="110.536" cy="110.544" fill="#1A73E8" rx="44.898" ry="44.915"/></g></g><path fill="#BDC1C6" d="M0 111.74h255.983v1.448H0zm0-1.465h255.983v1.448H0z" opacity=".1"/></svg>
\ No newline at end of file
diff --git a/src/commands/starter.ts b/src/commands/starter.ts
index 011bb2a..0fb569d 100644
--- a/src/commands/starter.ts
+++ b/src/commands/starter.ts
@@ -128,24 +128,36 @@ export class StarterCommands extends BaseCommands {
   }
 
   private getTemplates(): Array<QuickPickItem & { template?: ProjectTemplate }> {
-    const templates = [
+    const templates: Array<QuickPickItem & { template?: ProjectTemplate }> = [
       {
         kind: QuickPickItemKind.Separator,
         label: 'Vue',
       },
       {
         label: 'Create Vue(Official)',
-        detail: '🛠️ The recommended way to start a Vite-powered Vue project',
+        iconPath: {
+          dark: Uri.file(this.context.asAbsolutePath('resources/vue.svg')),
+          light: Uri.file(this.context.asAbsolutePath('resources/vue.svg')),
+        },
+        detail: 'The recommended way to start a Vite-powered Vue project',
         template: { id: 'create-vue', defaultProjectName: 'vue-project' },
       },
       {
         label: 'Vitesse(Anthony Fu)',
-        detail: '🏕 Opinionated Vite + Vue Starter Template',
+        iconPath: {
+          dark: Uri.file(this.context.asAbsolutePath('resources/vue.svg')),
+          light: Uri.file(this.context.asAbsolutePath('resources/vue.svg')),
+        },
+        detail: 'Opinionated Vite + Vue Starter Template',
         template: { id: 'vitesse', defaultProjectName: 'vue-vitesse-project' },
       },
       {
         label: 'Vitesse Lite(Anthony Fu)',
-        detail: '⛺️ Lightweight version of Vitesse',
+        iconPath: {
+          dark: Uri.file(this.context.asAbsolutePath('resources/vue.svg')),
+          light: Uri.file(this.context.asAbsolutePath('resources/vue.svg')),
+        },
+        detail: 'Lightweight version of Vitesse',
         template: { id: 'vitesse-lite', defaultProjectName: 'vue-vitesse-lite-project' },
       },
       {
@@ -154,31 +166,47 @@ export class StarterCommands extends BaseCommands {
       },
       {
         label: 'Nuxt3 Minimal Starter(Official)',
-        detail: 'Create a new Nuxt project, module, layer or start from a theme with our collection of starters.',
+        iconPath: {
+          dark: Uri.file(this.context.asAbsolutePath('resources/nuxt.svg')),
+          light: Uri.file(this.context.asAbsolutePath('resources/nuxt.svg')),
+        },
+        detail: 'Create a new Nuxt project',
         template: { id: 'nuxt3-minimal-starter', defaultProjectName: 'nuxt-project' },
       },
       {
         label: 'Vitesse Nuxt3(Anthony Fu)',
-        detail: 'Vitesse for Nuxt 3 🏔💚⚡️',
+        iconPath: {
+          dark: Uri.file(this.context.asAbsolutePath('resources/nuxt.svg')),
+          light: Uri.file(this.context.asAbsolutePath('resources/nuxt.svg')),
+        },
+        detail: 'Vitesse for Nuxt 3',
         template: { id: 'vitesse-nuxt3', defaultProjectName: 'nuxt-vitesse-project' },
       },
       {
         kind: QuickPickItemKind.Separator,
-        label: 'Web Extension',
+        label: 'TypeScript Library',
       },
       {
-        label: 'Vitesse WebExt(Anthony Fu)',
-        detail: '⚡️ WebExtension Vite Starter Template',
-        template: { id: 'vitesse-webext', defaultProjectName: 'webext-vitesse-project' },
+        label: 'Starter TS(Anthony Fu)',
+        iconPath: {
+          dark: Uri.file(this.context.asAbsolutePath('resources/ts.svg')),
+          light: Uri.file(this.context.asAbsolutePath('resources/ts.svg')),
+        },
+        detail: 'Starter template for TypeScript library',
+        template: { id: 'starter-ts', defaultProjectName: 'ts-library-project' },
       },
       {
         kind: QuickPickItemKind.Separator,
-        label: 'TypeScript Library',
+        label: 'Web Extension',
       },
       {
-        label: 'Starter TS(Anthony Fu)',
-        detail: 'Starter template for TypeScript library',
-        template: { id: 'starter-ts', defaultProjectName: 'ts-library-project' },
+        label: 'Vitesse WebExt(Anthony Fu)',
+        iconPath: {
+          dark: Uri.file(this.context.asAbsolutePath('resources/web-ext.svg')),
+          light: Uri.file(this.context.asAbsolutePath('resources/web-ext.svg')),
+        },
+        detail: 'WebExtension Vite Starter Template',
+        template: { id: 'vitesse-webext', defaultProjectName: 'webext-vitesse-project' },
       },
     ]
     return templates