diff --git a/package.json b/package.json
index 89d0ce0..be4e125 100644
--- a/package.json
+++ b/package.json
@@ -16,6 +16,16 @@
 				"types": "./dist/index.d.cts",
 				"default": "./dist/index.cjs"
 			}
+		},
+		"./utilities": {
+			"import": {
+				"types": "./dist/utilities.d.ts",
+				"default": "./dist/utilities.js"
+			},
+			"require": {
+				"types": "./dist/utilities.d.cts",
+				"default": "./dist/utilities.cjs"
+			}
 		}
 	},
 	"main": "./dist/index.cjs",
@@ -24,6 +34,7 @@
 		"dist"
 	],
 	"scripts": {
+		"build": "tsup",
 		"build-storybook": "storybook build",
 		"format": "prettier -w src",
 		"prepare": "husky install",
@@ -33,6 +44,10 @@
 	"lint-staged": {
 		"*.{css,js,md,ts,jsx,tsx,ts}": "prettier --write"
 	},
+	"dependencies": {
+		"clsx": "^2.0.0",
+		"tailwind-merge": "^1.14.0"
+	},
 	"devDependencies": {
 		"@storybook/addon-essentials": "^7.3.1",
 		"@storybook/addon-interactions": "^7.3.1",
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 4a80374..7ea59e4 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -11,12 +11,18 @@ dependencies:
   '@types/react-dom':
     specifier: ^18.0.0
     version: 18.2.7
+  clsx:
+    specifier: ^2.0.0
+    version: 2.0.0
   react:
     specifier: ^18.0.0
     version: 18.2.0
   react-dom:
     specifier: ^18.0.0
     version: 18.2.0(react@18.2.0)
+  tailwind-merge:
+    specifier: ^1.14.0
+    version: 1.14.0
 
 devDependencies:
   '@storybook/addon-essentials':
@@ -4418,6 +4424,11 @@ packages:
     engines: {node: '>=0.8'}
     dev: true
 
+  /clsx@2.0.0:
+    resolution: {integrity: sha512-rQ1+kcj+ttHG0MKVGBUXwayCCF1oh39BF5COIpRzuCEv8Mwjv0XucrI2ExNTOn9IlLifGClWQcU9BrZORvtw6Q==}
+    engines: {node: '>=6'}
+    dev: false
+
   /color-convert@1.9.3:
     resolution: {integrity: sha512-QfAUtd+vFdAtFQcC8CCyYt1fYWxSqAiK2cSD6zDB8N3cpsEBAvRxp9zOGg6G/SHHJYAT88/az/IuDGALsNVbGg==}
     dependencies:
@@ -8122,6 +8133,10 @@ packages:
     resolution: {integrity: sha512-AsS729u2RHUfEra9xJrE39peJcc2stq2+poBXX8bcM08Y6g9j/i/PUzwNQqkaJde7Ntg1TO7bSREbR5sdosQ+g==}
     dev: true
 
+  /tailwind-merge@1.14.0:
+    resolution: {integrity: sha512-3mFKyCo/MBcgyOTlrY8T7odzZFx+w+qKSMAmdFzRvqBfLlSigU6TZnlFHK0lkMwj9Bj8OYU+9yW9lmGuS0QEnQ==}
+    dev: false
+
   /tailwindcss@3.3.3:
     resolution: {integrity: sha512-A0KgSkef7eE4Mf+nKJ83i75TMyq8HqY3qmFIJSWy8bNt0v1lG7jUcpGpoTFxAwYcWOphcTBLPPJg+bDfhDf52w==}
     engines: {node: '>=14.0.0'}
diff --git a/src/index.ts b/src/index.ts
index e69de29..b6c7193 100644
--- a/src/index.ts
+++ b/src/index.ts
@@ -0,0 +1 @@
+export { cn } from "./utilities";
diff --git a/src/utilities.ts b/src/utilities.ts
new file mode 100644
index 0000000..1b8f7b5
--- /dev/null
+++ b/src/utilities.ts
@@ -0,0 +1,11 @@
+import { clsx, type ClassValue } from "clsx";
+import { twMerge } from "tailwind-merge";
+
+/**
+ * Merges tailwind utilities, and allows the usage of the clsx syntax in addition
+ * @param inputs list of class names
+ * @returns
+ */
+export function cn(...inputs: ClassValue[]) {
+	return twMerge(clsx(inputs));
+}
diff --git a/tsup.config.ts b/tsup.config.ts
index c749346..c0b7f04 100644
--- a/tsup.config.ts
+++ b/tsup.config.ts
@@ -1,6 +1,6 @@
 import { defineConfig } from "tsup";
 
-const pureCalls = [
+const reactPureCalls = [
 	"cloneElement",
 	"createContext",
 	"createElement",
@@ -13,10 +13,11 @@ const pureCalls = [
 ];
 
 export default defineConfig({
-	entry: ["src/index.ts"],
+	entry: ["src/index.ts", "src/utilities.ts"],
 	treeshake: true,
 	external: ["react"],
 	format: ["cjs", "esm"],
 	dts: true,
-	pure: pureCalls
+	pure: reactPureCalls,
+	clean: true
 });