diff --git a/.changeset/orange-toys-wait.md b/.changeset/orange-toys-wait.md
new file mode 100644
index 00000000..63a8e23d
--- /dev/null
+++ b/.changeset/orange-toys-wait.md
@@ -0,0 +1,5 @@
+---
+'@bnb-chain/create-gnfd-app': patch
+---
+
+feat: Add vite template
diff --git a/packages/create-gnfd-app/createApp.ts b/packages/create-gnfd-app/createApp.ts
index dd270cd2..f280cda3 100644
--- a/packages/create-gnfd-app/createApp.ts
+++ b/packages/create-gnfd-app/createApp.ts
@@ -35,7 +35,7 @@ export async function createApp({
   }
 
   /* eslint-disable-next-line no-console */
-  console.log(`Creating a new Greenfield app in ${green(root)}.`);
+  console.log(`Creating a new Greenfield app in ${green(appName)}.`);
   process.chdir(root);
 
   startSpinner('downloading template...');
diff --git a/packages/create-gnfd-app/example.gif b/packages/create-gnfd-app/example.gif
index ee5a6573..217e10c3 100644
Binary files a/packages/create-gnfd-app/example.gif and b/packages/create-gnfd-app/example.gif differ
diff --git a/packages/create-gnfd-app/helpers/install-template.ts b/packages/create-gnfd-app/helpers/install-template.ts
index ecf680d7..a155e35e 100644
--- a/packages/create-gnfd-app/helpers/install-template.ts
+++ b/packages/create-gnfd-app/helpers/install-template.ts
@@ -8,7 +8,7 @@ import { failSpinner, startSpinner, succeedSpiner } from './spinner';
 
 export const SRC_DIR_NAMES = ['app', 'pages', 'styles'];
 
-export type TemplateType = 'nextjs' | 'cra';
+export type TemplateType = 'nextjs' | 'cra' | 'vite';
 export type TemplateMode = 'js' | 'ts';
 
 export const installTemplate = async ({ appName, root, packageManager }: InstallTemplateArgs) => {
diff --git a/packages/create-gnfd-app/index.ts b/packages/create-gnfd-app/index.ts
index 4bb9b646..f827d6eb 100644
--- a/packages/create-gnfd-app/index.ts
+++ b/packages/create-gnfd-app/index.ts
@@ -5,13 +5,12 @@ import path, { resolve } from 'path';
 import { cyan, green } from 'picocolors';
 import validateNpmName from 'validate-npm-package-name';
 import { createApp } from './createApp';
-import { getPkgManager, PackageManager } from './helpers/get-pkg-manager';
+import { PackageManager } from './helpers/get-pkg-manager';
 import { TemplateType } from './helpers/install-template';
 import { isFolderEmpty } from './helpers/is-folder-empty';
 
 const packageJson = JSON.parse(readFileSync(resolve(__dirname, '../package.json'), 'utf-8'));
 let projectPath = '';
-// const projectName = 'xxx';
 
 const program = new Commander.Command(packageJson.name);
 program
@@ -57,6 +56,7 @@ async function runInitPrompts(): Promise<void> {
     choices: [
       { name: 'nextjs', value: 'nextjs' },
       { name: 'create-react-app', value: 'cra' },
+      { name: 'vite', value: 'vite' },
     ],
   });
 
diff --git a/packages/create-gnfd-app/templates.ts b/packages/create-gnfd-app/templates.ts
index 683d5163..5c7f2234 100644
--- a/packages/create-gnfd-app/templates.ts
+++ b/packages/create-gnfd-app/templates.ts
@@ -4,4 +4,5 @@ import { TemplateType } from './helpers/install-template';
 export const TEMPLATES_MAP: Record<TemplateType, string> = {
   nextjs: getTemplateUrl('nextjs'),
   cra: getTemplateUrl('cra'),
+  vite: getTemplateUrl('vite'),
 };