diff --git a/src/components/Email/index.ts b/src/components/Email/index.ts
index c21a34a..a890456 100644
--- a/src/components/Email/index.ts
+++ b/src/components/Email/index.ts
@@ -1 +1 @@
-export * from './Email';
+export { Email, EmailProps } from './Email';
diff --git a/src/components/index.ts b/src/components/index.ts
new file mode 100644
index 0000000..c21a34a
--- /dev/null
+++ b/src/components/index.ts
@@ -0,0 +1 @@
+export * from './Email';
diff --git a/src/index.ts b/src/index.ts
index 01e97ec..590a7f4 100644
--- a/src/index.ts
+++ b/src/index.ts
@@ -1,2 +1,2 @@
-export * from './components/Email';
+export * from './components';
 export * from './utils';
diff --git a/src/utils/index.ts b/src/utils/index.ts
index e945b90..6cb15c3 100644
--- a/src/utils/index.ts
+++ b/src/utils/index.ts
@@ -1 +1,2 @@
-export * from './stylings';
+export { sx } from './stylings';
+export { makeStyles } from './makeStyles';
diff --git a/src/utils/makeStyles.ts b/src/utils/makeStyles.ts
new file mode 100644
index 0000000..71f1cb3
--- /dev/null
+++ b/src/utils/makeStyles.ts
@@ -0,0 +1,19 @@
+import { CSSProperties } from 'react';
+
+interface CSSClasses {
+  [key: string]: CSSProperties;
+}
+
+const mergeStyles = (target: CSSClasses, source: CSSClasses): CSSClasses => {
+  for (const key in source) {
+    target[key] = Object.assign({ ...target[key] }, { ...source[key] });
+  }
+
+  return target;
+};
+
+export const makeStyles = (classes: CSSClasses) => {
+  return (classes_?: CSSClasses) => {
+    return mergeStyles(classes, classes_ as CSSClasses);
+  };
+};
diff --git a/src/utils/mergeDeep.ts b/src/utils/mergeDeep.ts
deleted file mode 100644
index 5117e13..0000000
--- a/src/utils/mergeDeep.ts
+++ /dev/null
@@ -1,38 +0,0 @@
-import { CSSProperties } from 'react';
-import { CSSClasses } from './stylings';
-
-const isObject = (item: CSSClasses | CSSProperties): boolean => {
-  return item && typeof item === 'object' && !Array.isArray(item);
-};
-
-export const mergeDeep = (target: CSSClasses, ...sources: CSSClasses[]): CSSClasses => {
-  if (!sources.length) return target;
-  const source: CSSClasses = sources.shift() as CSSClasses;
-
-  if (isObject(target) && isObject(source)) {
-    for (const key in source) {
-      if (isObject(source[key])) {
-        if (!target[key]) {
-          Object.assign(target, {
-            [key]: source[key],
-          });
-        } else {
-          const targetObject = { ...target[key] };
-          const srcObject = { ...source[key] };
-          const mergedObject = Object.assign(targetObject, srcObject);
-          target[key] = mergedObject;
-        }
-      } else {
-        Object.assign(target, {
-          [key]: source[key],
-        });
-      }
-    }
-  }
-
-  if (sources.length) {
-    return mergeDeep(target, ...sources);
-  } else {
-    return target;
-  }
-};
diff --git a/src/utils/stylings.ts b/src/utils/stylings.ts
index 2615e61..4dee9af 100644
--- a/src/utils/stylings.ts
+++ b/src/utils/stylings.ts
@@ -1,9 +1,4 @@
 import { CSSProperties } from 'react';
-import { mergeDeep } from './mergeDeep';
-
-export interface CSSClasses {
-  [key: string]: CSSProperties;
-}
 
 export const sx = (...args: CSSProperties[]): CSSProperties => {
   const initialValue: CSSProperties = {};
@@ -14,9 +9,3 @@ export const sx = (...args: CSSProperties[]): CSSProperties => {
 
   return result;
 };
-
-export const makeStyles = (classes: CSSClasses) => {
-  return (classes_: CSSClasses) => {
-    return mergeDeep(classes, classes_);
-  };
-};