diff --git a/src/i18n/index.js b/src/i18n/index.js
new file mode 100644
index 000000000..ff2049255
--- /dev/null
+++ b/src/i18n/index.js
@@ -0,0 +1,62 @@
+/**
+ * You can customize the initial state of the module from the editor initialization
+ * ```js
+ * const editor = grapesjs.init({
+ *  i18n: {
+ *    locale: 'en',
+ *    messages: {
+ *      en: {
+ *       hello: 'Hello',
+ *      },
+ *      ...
+ *    }
+ *  }
+ * })
+ * ```
+ *
+ * Once the editor is instantiated you can use its API. Before using these methods you should get the module from the instance
+ *
+ * ```js
+ * const i18n = editor.I18n;
+ * ```
+ *
+ * @module I18n
+ */
+import messages from './messages';
+
+export default () => {
+  let em;
+  let config;
+  const { language } = window.navigator || {};
+  const localeDef = language ? language.split('-')[0] : 'en';
+  const configDef = {
+    locale: localeDef,
+    localeFallback: 'en',
+    counter: 'n',
+    messages
+  };
+
+  return {
+    name: 'I18n',
+
+    /**
+     * Get module configurations
+     * @returns {Object} Configuration object
+     */
+    getConfig() {
+      return config;
+    },
+
+    /**
+     * Initialize module
+     * @param {Object} config Configurations
+     * @private
+     */
+    init(opts = {}) {
+      config = { ...configDef, ...opts };
+      em = opts.em;
+      this.em = em;
+      return this;
+    }
+  };
+};
diff --git a/src/keymaps/messages.js b/src/keymaps/messages.js
new file mode 100644
index 000000000..c72ded396
--- /dev/null
+++ b/src/keymaps/messages.js
@@ -0,0 +1,5 @@
+export default {
+  en: {
+    hello: 'Hello'
+  }
+};