diff --git a/apps/api/src/lib/buildPacks/heroku.ts b/apps/api/src/lib/buildPacks/heroku.ts
new file mode 100644
index 000000000..5bf1e4796
--- /dev/null
+++ b/apps/api/src/lib/buildPacks/heroku.ts
@@ -0,0 +1,15 @@
+import { executeDockerCmd, prisma } from "../common"
+
+export default async function (data: any): Promise<void> {
+    //   console.log(data)
+    const {applicationId, tag, dockerId} = data
+// 	try {
+      await executeDockerCmd({
+          dockerId,
+          command: `pack build ${applicationId}:${tag} --builder heroku/buildpacks:20`
+      })
+
+// 	} catch (error) {
+// 		throw error;
+// 	}
+}
diff --git a/apps/api/src/lib/buildPacks/index.ts b/apps/api/src/lib/buildPacks/index.ts
index 163aa3a7d..b8eb4d609 100644
--- a/apps/api/src/lib/buildPacks/index.ts
+++ b/apps/api/src/lib/buildPacks/index.ts
@@ -15,6 +15,7 @@ import eleventy from './static';
 import python from './python';
 import deno from './deno';
 import laravel from './laravel';
+import heroku from './heroku';
 
 export {
 	node,
@@ -33,5 +34,6 @@ export {
 	eleventy,
 	python,
 	deno,
-	laravel
+	laravel,
+    heroku
 };
diff --git a/apps/ui/src/lib/templates.ts b/apps/ui/src/lib/templates.ts
index b2e27ad1c..d99995b35 100644
--- a/apps/ui/src/lib/templates.ts
+++ b/apps/ui/src/lib/templates.ts
@@ -292,7 +292,13 @@ export const buildPacks = [
 		fancyName: 'Deno',
 		hoverColor: 'hover:bg-green-700',
 		color: 'bg-green-700'
-	}
+	},
+    {
+        name: 'heroku',
+		fancyName: 'Heroku Buildpack',
+		hoverColor: 'hover:bg-indigo-700',
+		color: 'bg-indigo-700'
+    }
 ];
 export const scanningTemplates = {
 	'@sveltejs/kit': {